As you know I use WordPress as my blogging platform simply because I love PHP and the simplicity that comes with a beautiful syntax. This post shows you how to create a rotating banner for your WordPress blog.
Getting Your Banners Together
First of all this is just a dirty template hack that will not go away as you upgrade your WordPress distribution. The first step is to create a set of banners you want to rotate and name them sequentially. For example, mine are named vladville-bar1.jpg, vladville-bar2.jpg, vladville-bar3.jpg and so on. Here they are:
Look familiar? Great. Notice how only one number in the filename changes? Now upload all of these banners to the same directory, mine are in /images.
Hack The Template
The second step is to actually hack the template file. Because WordPress is PHP based you can embed PHP code anywhere in your template. Mine is in the header.php but you can use this trick anywhere you want to.
Remember how only the number was different? The only thing I did was instruct PHP to select a random number from a range and insert that number in HTML code. So here is the entire mastery:
<table background=â€/images/vladville-bar<?php echo rand(1,23); ?>.jpg†width=â€800″ height=â€155″ border=â€0″>
Thats the entire mastery right there. When the template is parsed by WordPress and PHP it will call a rand function which returns a random integer in the range between 1 and 23. I happen to have 23 images on the server so returning a random number between 1–23 will return a number of one of the images in that range. The <?php part tells the server to start interpreting the next block of text as code instead of just plain filler. The ?> stops it. The echo sends stuff back to be printed and 1,23 are parameters sent to the rand function. Every time the page is reloaded the rand() function should return a different random number between 1–23 giving my visitors a different random banner from my pool of 23. For example:
First time rand(1,23) executes it returns 5. As a result, you will see vladville-bar5.jpg
<table background=â€/images/vladville-bar5.jpg†width=â€800″ height=â€155″ border=â€0″>
Second time rand(1,23) executes it returns 17. As a result, you will see vladville-bar17.jpg
<table background=â€/images/vladville-bar17.jpg†width=â€800″ height=â€155″ border=â€0″>
Thats all there is to it but I figured I’d start slow and build up. Imagine the possibilities here, you can insert greetings based on the time of day, display random quotes, insult visitors by guessing their IQ with rand(5,30) and so on.
So get creative. Your blog does not have to be borg it should reflect your individuality. After all, its all yours.
Link to WordPress Hack: Rotating Banners
This is multi-purpose post. First I want to try this hack on my test WordPress blog. If I have time I want to try and configure a demo website to replace the current Habitat for Humanity affiliate website. The two most important characteristics that can lead to a successful HFH website is current news and photos. Using a blog can make the website easier to update and keep current. Rotating current photos on the front page makes the page more interesting for casual visitors but will require a little more computer knowlege.
My second objective is make this post using the GreatNews reader/Live Writer plugin. I have been using GreatNews for several weeks and I occasionally use w.bloggar via a GreatNews plugin to comment on other people’s posts. GreatNews supports several “Blog This” options including the plugin to w.bloggar. Today GreatNews released a plugin to make Live Writer a “Blog This” option. I was actually thinking about cloning the w.bloggar plugin to provide this functionality to Live Writer but someone beat me to it. Live Writer and w.bloggar are both nice front ends for blogs but Live Writer has a better user interface. For those who are unaware of these tools, they are the latest attempts to add a little extra word processing functionality to the process of creating new posts.
Since I prefer my websites to validate as xhtml, I run into occasional problems when I comment or include posts from other people. The html editors provided with most blogs are okay for new posts and most simple comment posts. I can look at the html code and fix the simple mistakes. When there are a lot of mistakes and you need a little extra help, Live Writer and w.bloggar can make editing the post easy and quick.
In looking at this post in Live Writer I have to admit I prefer this interface over the w.bloggar interface. It is not a hard decision. Wyswig is easier to use than raw html. It is nice that all of the links and images have the right addresses.