Change the style and colour of blockquote

Hi,

You can use pull quotes from Formats – http://screencast.com/t/prNlLXy28u and you can change the font style and size from Theme Fonts – http://screencast.com/t/ohhSj8hWTimd also the text will take theme accent color – http://screencast.com/t/KMo00zjO
If you want to change that color you can use custom css in Theme Panel > Custom Css – http://screencast.com/t/pIdgFFkR

.td-post-content blockquote p {
color: #b7b7b7;
}

Thanks!

Hi,

The double quotes are added there like an image if you want to change them you will have to use custom css in Theme Panel > Custom Css and replace the image – http://screencast.com/t/ZlxvPxQVK

.td-post-content .td_pull_quote p:before{
background:url("http://www.mythoughtsmywords.org/images/double-quotes.png") no-repeat scroll 0 0 !important;
background-size: 20px 20px !important;
}
.td-post-content .td_pull_quote p:after {
background:url("http://image.shutterstock.com/display_pic_with_logo/577306/235529839/stock-vector-quotation-mark-symbol-double-quotes-at-the-end-of-words-quote-sign-icon-isolated-on-white-235529839.jpg") no-repeat scroll 0 0 !important;
background-size: 20px 20px !important;
}

Thanks!

• This reply was modified 11 years by Alin [tagDiv].

Hi,

Like I said theme has mor options to use quotes from Formats, you will need custom work to achieve that on default blockquote or add them manually. You can try a custom css like is used on pullquotes and add you double quote image: http://screencast.com/t/WTkGKDWk

.td-post-content blockquote p:before{
position: absolute;
background:url("http://www.mythoughtsmywords.org/images/double-quotes.png") no-repeat scroll 0 0 !important;
background-size: 20px 20px !important;
left: 0;
display: block;
content: '';
width: 20px;
height: 20px;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
}
.td-post-content blockquote p:after {
position: absolute;
bottom: 10px;
right: 0;
display: block;
content: '';
width: 20px;
height: 20px;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
background:url("http://www.mythoughtsmywords.org/images/double-quotes.png") no-repeat scroll 0 0 !important;
background-size: 20px 20px !important;
}

You may need to adjust the custom css code, if you don’t know how to do it I suggest to get someone to help you as we cannot provide custom work at this time. Also if you use the above css for default blockquote, please not that all other quotes format will be affected – http://screencast.com/t/zRQZnfYNyfn

Thanks!

Hi,

You need to customize this also for page like you did on posts, also if you want to make this change for all template you can try to add your double quotes directly in style.css – http://screencast.com/t/Wx9q6ADqROY Also you have Formats in a text block added with Visual Composer – http://screencast.com/t/o8KQBtfFxaw
Also the breadcrumbs are displayed on default page template only when pagebuider is not used – http://screencast.com/t/ykINOucHy4s or you can try to use pagebuilder with title – it should work also with pagebuilder content – http://screencast.com/t/Cgr95d2auNh – http://screencast.com/t/KdUtRwr6

Thanks!

Hi,

The default page template was not designed to show excerpts or title when pagebuilder is used. You ca use pagebuider with title on pages where you want breadcrumbs or make this change in page.php (add breadcrumbs also when Visual Composer is used) – http://screencast.com/t/7RLhGIMT3xO

Thanks!