Spicing up your WordPress ‘blockquote’ style

April 19, 2006 by  

One of my readers, Kurniawan asked what I did to make my blockquote box looks like this

Instead of writing my reply via the comment section I thought I reply his question in this new post so that others who might be interested can read it too.

The effect is achieved by setting several Cascading Style Sheet (CSS) properties in my style.css file.

For my template, I am using this code

blockquote {
border: 1px solid #5c5656;
margin: 1em 0;
padding: 10px;
background: #f8f7f6 url(images/blq.gif);

Just put this code or edit your existing blockquote properties. Then download blg.gif and place it into the appropriate folder.

Did you enjoy this post? Please subscribe via RSS or email.

Related posts


RSS feed | Trackback URI


Comment by hwa
2006-10-02 06:25:15

cool effect! use it in my blog 😉 thanks for the tips!! 🙂

Comment by HomeGrownMommy Subscribed to comments via email
2009-06-10 09:45:55

Hi there! I can’t quite get this to work. (Warning: I am a newbie!!) 🙂 I copied the code as is and pasted it into my blog. I tried to download the pic, but it showed a blank page. My blog is on – does this have something to do with it?

Comment by V3King
2011-11-13 00:55:55

It’s A Quite Good But There Are Any Cool Blackquote For WordPress?

Name (required)
E-mail (required - never shown publicly)
Subscribe to comments via email
Your Comment (smaller size | larger size)
You may use <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong> in your comment.

Trackback responses to this post