Wordpress Rotating Header Images no Plugins
The first time that I saw rotating header images was on Chris Pearson’s personal blog Pearsonfied.com and I really liked the feature a lot. If you do not already know Chris is the man responsible for the well designed Cutline Wordpress Theme that actually comes with an implementing tutorial for adding the rotating image headers including the images. This may be the answer you’ve been looking for if you do not mind changing your entire theme just to get image rotations up top.
Anyway since I do not want to change my entire theme and with a little from my friend Google I was able to locate quite a few methods in which to accomplish the fabulous image rotation. As always I will only be explaining the route that I choose for my site. If you are interested in some possible plugin solutions you can find a few at Lorelle’s site.
Unfortunately for the novice I did not decide on a Wordpress plugin this go around and instead I with some good old code manipulation. Given the fact I am not an expert by far in the department of; php and css it took a little time to figure out how to make this work with my theme.
Rotating Header Images Step 1:
- Copy the php code here (below rotator apart header)
- Save it to notepad
- Save the file as rotator.php
- Open your FTP program
- Make a new folder (random)
- Upload the rotator.php to the random folder
- Find images now that meet header height & width
- Upload those images to the random folder

Rotating Header Images Step 2:
The coding if your using the Misty theme your in luck because that is what I use and I have already figured out the coding to make this all work.
Go to your style.css file in your dashboard and you have to find out what attribute your theme uses to place your header image and you have to place the URL to the random folder which has the images and the rotater.php file. Once again if you are using the Misty them then just find #headerimage and copy the code below.
#headerimage {
clear: both;
background: #fff url(http://jakeldaily.com/random/rotater.php) no-repeat 0 0;
margin: 0px;
color: #fff;
height: 175px;
}
Congratulations to those of you that have finished this task and successfully made it work for your theme. I must admit immediately after I got it to work with my test images I went directly to Flickr and starting stealing images to put into my new rotation.
Then thirty minutes into my image stealing frenzy I realized something! This is my personal blog and why am I putting other people’s pictures into the image header focal point of the site.
A light blub went off at this moment and that is when I decided to start looking through my personal travel pictures and use them (travel date & place right hand corner) in my rotating image header. My intentions are to have ten images in total in the next few days and at the moment I have six to include; Ferrari Vegas, Venice Italy, Attre Belgium, Bognor Regis UK, Maldives, and Alicante Spain.
comments
Maybe You Missed These Posts:
- Twenty Four Posts In 24 Hours!
- WordPress Stats Plugin Release
- Wordpress Plugins Equal Traffic
- Wordpress 2.1.1 Released
- Secure PHP Contact Form Plugin
- Wordpress Plugins Related Posts
- Wordpress Plugins War II
10 Responses to “Wordpress Rotating Header Images no Plugins”
Leave a Reply





i don’t like rotating header images… they are not so impressive..
rotating header messages are way cooler than the other thing I knew about, which was rotating blog slogans.
That’s pretty interesting about rotating headers. I didn’t realize they were out there, but it makes sense to keep a site looking fresh and keeping everyone’s eyeballs from going content blind.
I think it was worth the trouble. It’s so eye-catching when I stop by and see a completely different header. Most blogs are too static up top…mine included if you go straight to the typepad part at least.
*iza
Thanks for sharing the tip been thinking about adding this tip.
Love this idea. I’m looking for a way to display a different header for my most popular categories. Just need some time to sit down and work my way through the code…
Thanks for posting!
–Steve
Great article! Rotating headers are awesome. They are huge eye catchers. Thanks again for a well-written guide.
Thank you for this. I have been looking for good addon like this one a while a go. Eye catchy thing, what else can I say
I always use javascript for this, take a look at http://www.dyn-web.com/javascript/rotate-img/
I appreciate this information. I’m looking to implement a new theme for one of my blogs and have been taking a look at various headers. Some I like, some I don’t. believe rotating headers can be a “fresh” way of refreshening any site without making other changes to it.