Support » Everything else WordPress » creating page background images

  • anyone have a good tutorial on creating page backgrounds with shadow effects that run the sides of the page? Er, using Photoshop.

    Oh, sorry.. also, how to create the running count on posts and comments and show them as Chris Davis has done on his blog?


Viewing 11 replies - 1 through 11 (of 11 total)
  • Certainly a lot of free tutorials for stuff like this on the Web. Have you tried Google?

    As for the recent posts/comments etc, there are a number of plugins for things like that:

    Kaf –

    yeah, I know how to use photoshop to add a dropshadow to things such as text, pics, etc. But, seems that creating a 1200px by 9px background image with a dropshadow that sits on the outer edges of a blog page is done a little differently. So, was hoping that someone who has made their own (like the background used here on the WP forum) might have some instructions on how they did it.

    The 2nd link for the comments looks like it does what I was asking. I’ll give it a shot.


    This is close as I can come to learning the most simple thing. Sure the dropshadow would be nice, but I’m just trying to get a repeating image on the background. Where do I edit this? I’ve been in style.css, and in index.php, and all the other places I’ve seen images referenced , and I just can’t find it. All changes I’ve tried do nothing. I’m using Internet Explorer.

    Thanks in advance.


    Mitch: Check header.php. In the default (kubrick) theme that’s where the background images are called from.

    There’s two basic ways people add dropshadows to a page.

    1. Use a full width element centered on the css body element. See for an example.

    2. Use a background image on your page containing element. So if your page is centered with the #wrap element you’d put a background on that. Check the default (Kubrick) design for an example.

    Basically, you gotta fake it to make it 😉

    I too am having a difficult time wrapping my head around the dilemma, and did spend several hours searching google for a solution. Maybe I’m not asking the right question, not holding my mouth right, what ever it is, I’d love to know the secret of geting the effect to work properly.

    Thanks for the quick help. I wasn’t holding my mouth right.



    My problem is that when I substitute the background image with one I create in PS, it’s not “seamless”. I created an image the exact same dimensions as the previous, basically created the two tones for two columns. However, the drop shadow element is broken as it tiles. Therein lies the dilemma. It may very well be a PS issue.

    If you post a link to your image and to the CSS that you used to try and get it to tile, I’ll be able to help you. If you don’t get a response from me here after posting the info, email me… nuclearmoose at gmail dot com. After we get you sorted out I’ll post back here what we did to get it working for you.

    Thanks for the offer, but I found out what my problem was. It was PS related. I was creating an image exactly the size I needed, and placing a drop shadow. The shadow wouldn’t line up. So I created an image 3 times the height of what I wanted, layed down the colors, etc, and the drop shadow. I then went and cut out the center of the file, and made that my tile, and the image tiles perfectly. Funny I couldn’t find a tutorial or mention of the problem anywhere. Did feel nice to solve the problem myself though.

    Anyway, thanks again to all for offering up help.

    I think this kink in the tile is something to do with the image crop. I just wish I knew what it was. png can be more stable for shadows.

Viewing 11 replies - 1 through 11 (of 11 total)
  • The topic ‘creating page background images’ is closed to new replies.