Code — Auto Drop-cap For Thesis And Other WordPress Themes

With Thesis you can turn every first letter of the post to a drop cap. There are two ways you can do it. First is to go the official way and include the first letter like so:

.custom .entry-content p:first-child:first-letter {
font-size: 3.571em; line-height: 0.76em; padding: 0.04em 0.12em 0 0;
color: #888; float: left;
}

However if you have a pretty large and old blog, it will be humanly impossible to go in after each post and edit it to include the above the above code and implement a drop cap effect. One way around it is to use a regular expression and do a “find and replace” on the database.

Or else, magic… The following code automatically turns the first letter of each post into a drop cap. Place this into your custom.css (or style.css if you are not using the Thesis theme).

.custom .entry-content p:first-child:first-letter {
font-size: 3.571em;
line-height: 0.76em;
padding: 0.04em 0.12em 0 0;
color: #888;
float: left;
}

As always feel free to play around with this code till you get the effect you want. This works on most standards compliant browsers like Firefox, Seamonkey and Google Chrome. This works on Internet Exlorer 8 too but breaks the layout. And if you are looking for a free copy of Thesis WordPress Theme, you can save $87 and get it here.

Divi WordPress Theme