How to add dropshadows to WordPress articles posts and pages

Posted on November 11, 2007

Here is a complete rundown of how to add dropshadows to your WordPress posts, pages and the single articles.

Before you start, you are going to need to get few things ready. You are going to need three sets of graphics, a top, middle and bottom. You are also going to need the style sheet information as well

grab these

Wherever you theme is, you going to want to place the .png files in your images folder. It will be something like, wp-content/themes/default/images/. Now open the style.css file and copy the code and paste it into the style.css file that comes with your theme, at the end of the file is fine.

Now, in your theme’s folder there are a few pages you will need add code to. The first will be index.php. Open the readme file and copy the div statements under the before section.

In my case, there is a line that has a command that reads post information that looks like this..

the_content(

Paste the div code you copied from the readme file right before the “the_content” part. This will draw the top section and start the middle part. As your article gets longer, the middle part will repeat until you close the div tag off.

Go back to the readme file and copy the rest of the div code, the two closing divs and the bottom part.

Now paste that right under the “the_content” line. That should finish off the main page look. Just to let you know, this is based off a fresh copy of the default theme that comes with WordPress. The post information is about 480 pixels wide, you may need to play with the graphics a bit

Repeat the same steps for the single.php and page.php files. There really isn’t that much to it. If you need additional help, please leave a comment, I check back often.

Categories: Uncategorized


Leave a Reply