Hello,
I’ve been very frustrated in trying to format blockquotes within Newsmag.
Live CSS does not seem to fully work when editing blockquotes.
I’d like an easy way to align left, full width, change color, indent, line spacing, etc.
Can you please advise?
SR
Hi,
Most of things that you want to do can be achieve using the settings from theme panel -> https://i.imgur.com/DbjAjL1.png
If you want to have more control over the blockquote, you must use a custom css, for example if you want to change the color -> https://i.imgur.com/NeWMJQ8.png
.td-post-content blockquote p{
color: red;
}
or if you want to change the Blockquote align -> https://i.imgur.com/DgMqKwW.png
.td-post-content blockquote {
text-align: left;
}
This code need to be set in them panel> custom code> custom css.
Hope this will help you!
Super helpful; thanks!
If you have other questions related to our theme, let us know!
Have a nice day!
I’m using a numbered list in a block quote, but the numbered list is not assuming the text formatting properties of the block quote text. How may I change the appearance of a numbered list within a block quote?
SR
Hi,
You can set a list using the classic element and then use the Blockquote -> https://i.imgur.com/AoDQonz.png the results will be this -> https://i.imgur.com/amODfz9.png
Please let me know what you want to do, in this way I will be able to help you!
Thank you!
Thanks for your response.
I’d like to match the list formatting (color and size) to the block quote formatting. Here’s how it presently appears: https://postimg.cc/KK7tdLKt
Hi,
Please let me know the steps you make to set the list and provide a link to your article to can inspect it, therefore if there are no settings to achieve what you need, I will provide a custom css.
Thank you!
Hello,
I just highlighted the text and clicked on the block quote button. Since the list was inside the block quote, I wanted it to assume the color and formatting of the blockquote.
Here is a direct link.
Hi,
If you like, you can try this custom css -> https://i.imgur.com/qugOalK.png
.td-post-content blockquote ol {
text-align: left;
padding: 0 50px;
margin-left: 0;
border-left: 5px solid lightsteelblue;
background-color: #f8f8fa;
border-radius: 0px 15px 15px 0px;
padding: 20px 30px;
font-family: Actor;
font-size: 20px;
font-style: normal;
text-transform: none;
color: #1e73be;
}
Or if you want it simple like this -> https://i.imgur.com/83fGKdY.png use this code
.td-post-content blockquote ol {
font-family: Actor;
font-size: 20px;
font-style: normal;
text-transform: none;
color: #1e73be;
}
The code need to be set in theme panel> custom code> custom css.
Hope it will help you!
Super helpful; thanks. Example 2 was perfect for the numbered lists.
Now, is there a way to indent the second line of the numbered list so that it aligns with the text, and not with the number itself?
Hi,
You can do that using a css like this one -> https://i.imgur.com/Yyo4JCb.png
.td-post-content ol{
list-style-position: outside;
}
Hope it will help you!
You are terrific; thanks. Just what I was looking for!
BTW, do you have a tutorial for using the Live CSS feature?
SR
Hi,
Thank you! yes we have a guide https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/ also you can set the css in theme pane, or using tagDiv Composer in css element -> https://i.imgur.com/ar1c8h6.png or css composer -> https://i.imgur.com/8phmhOJ.png -> https://tagdiv.com/live-css-box/
Have a nice day!
