ShoutMeLoud – Shouters Who Inspire

Superlinks
≡ Menu
≡ Menu

How to Customize Thesis Theme Block Quote

CW
How to Customize Thesis Theme Block Quote

Block quotes or quotes are usually used to show a note fro other blogs or to show a comment.   You can see an example of Block quotes in my previous post on

How to start with professional blogging?

Block quotes make a post scan able and readers a can easily navigate through the important part of the post. Most of wordpress themes does not have any style enabled for Block quotes, but this can easily be done with Thesis custom.css.

To Enable the block quotes in Thesis theme, you need to add these lines of code in your custom.css file.

.custom blockquote { color: #1C2639; padding-top: 10px; padding-bottom: 0.5px; padding-right: 5px;
font: italic 1.2em Georgia, "Times New Roman", Times, serif; -moz-border-radius: 5px;
-webkit-border-radius: 5px;

}

.custom blockquote { background: #ECEFF5; }

 

You can change the last line color code #ECEFF5 to any desired background color you want for your quotes.

 

  • Author Bio

  • Latest Post

Article by Harsh Agrawal

Harsh has written 1069 articles.

If you like This post, you can follow ShoutMeLoud on Twitter. Subscribe to ShoutMeLoud feed via RSS or EMAIL to receive instant updates.


{ 6 comments… add one }

  • al

    Hi Harsh,

    thanks for providing the css code. I’ve been searching online almost all day but couldnt find the perfect one that suits my style, until i found your blog. So thanks so much.

    Al

    Reply
  • Julie-Inspired to Write

    I am curious, my bottom padding is set at 0.5 and it looks like more. When I set it to 0, there is NO padding. Anything above 0 (even 0.01) gives it the same large padding as 1px or higher. Thanks for the post! I will be adding your site to my ‘top must follow blogs’ post in a couple weeks!

    Reply
  • James Cage

    I love that post. Great tutorial. I’ll use it tonight. Thanks

    Reply
  • tommy

    Thank, nice tips.

    Hey, i saw your ads in the center if this post.
    How you do that. Can you give me a hint?
    And how to wrap it with the text?

    Thanks Before

    Reply
  • Marius

    Hi Harsh,

    i have a little Offtopic Question. I´ve noticed, that you also use Thesis as your Wordpress Theme. I am wondering, how you realize the Thumbnail Pics beneath the Teasers on the Index Page. This is really nice. Can you please give me a Hint?
    Thanks a lot.

    Reply
  • Surender Sharma

    Hi Harsh,
    Really impressive css styling of block.
    Actually I was thinking to changing the style for my blog but you have done this great job nicely.
    Thanks buddy.

    Reply

Leave a Comment