As part of my new header design for this blog, I am using a series of 12 header images which rotate randomly.

I’ve had a few people comment on that and wonder how I did it. It is actually VERY easy to do.

First, you create the images you want in your header. Make them all the same dimensions that way they can change without making your layout different.

When you name the images, give each of them a numeric file name. For example:

• topphoto_1.jpg
• topphoto_2.jpg
• topphoto_3.jpg
• and so on.

Make sure not to skip any numbers. It has to be a constant series of numbers.

Now, you modify your blog theme. In the section of your header.php file where you want this image to appear, use this instead:

<img src=”topphoto_<?php echo rand(1,X); ?>.jpg” width=”123” height=”123” />

Now, the most important part of that is the PHP code inside of the filename. What you’re doing is telling PHP to give you a random number between 1 and X. Replace X with the number of images you have available. In my case, I have 12 header images, so I would use rand(1,12). Also, make sure you use the actual height and width of your images in the HTML.

That’s all there is to it, guys. No javascript necessary. No plug-ins, either.