WordPress theme with a large header image
UPDATE: I ditched the Tasteful theme I developed to originally power this blog. Therefore, I am no longer offering it for download as I will not be maintaining it.
The ubiquitous large and usually pretty header image is far from rare in the realm of free WordPress themes. In fact, they are pretty common these days. Still, the large, pretty header image approach can have positive effects on your reader’s perceptions of your blog, especially if the content leaves something to be desired. But the key to a positive WordPress experience is picking a theme that you can and intend to modify to fit your personal style.
When considering starting points for the design of this blog, I almost passed over Tastelessly because of the static header image. But after careful consideration of the clever color scheme and overall uniqueness, I realized that the possibilities were abundant. My first modification to the theme came in the form of PhotoMatt’s rotating image script, written in PHP. You can see where this is going I hope.
So, after obtaining the latest release of the script and giving a once-over to the limited documentation about the script available on the download page, I uploaded the script to my images folder and I was on my way to slight diversity.
The next step was to obtain a good set of images, of course I went to stock.xchng to collect my samples. If you haven’t heard about this site, go there now and thank me later. Not the best stock photos out there, but they are all free to download and use (per the individual license conditions). After about an hour of meaningless meandering through the abstract > playing with light category, I had about 50 images to work from, cost to me just one hour of my life.
After a quick comparison of each photo to the look, color and layout of my site (done via side by side windows, one being PhotoShop the other, Firefox with my site loaded), I began editing my photos so they would fit the size of my header image (978×263). Some pictures were okay to stretch, others weren’t. Suffice it to say I spent another 90 minutes editing the photos I downloaded.
Once that mess was finished, I uploaded my new header images to my theme’s images directory, set the minor options inside the plugin file, and finally changed the reference to my header image to link to the rotator script (aptly named rotator.php). Save the stylesheet back to my server, refresh my homepage (ok, I did it 30 times because I was bored), and bada-bing - I have a rotating header image.
Now, of course, you will notice that the header image only rotates when the page is refreshed. There are other methods that use javascript (inaptly coined AJAX by the ignorant masses) to rotate images at a given period of time. I may discuss that method here in a future post, as I continue the struggle to birth a semi-unique blog before the eyes of the public.
Leave a Reply