This article describes how to use variables.php to rotate the banner image on your skin. You can see an example of this technique in action at Wormhole Crossing. The first step in the creation of your rotating banner is to create your banner images. You'll put these images in the images/ folder in your skin. The next step is to open (or create) the variables.php file for your skin. You'll add 2 lines to your variables.php. The first one is an array (list) of images for your header:

$headerpics = array("image1.jpg", "image2.jpg", "image3.jpg", "image4.jpg", "image5.jpg", "image6.jpg");

You can have as many images in the list as you want. The second line assigns the variable {headerpic} to your skin and randomly chooses one of the images from your list to place in that variable.

$tpl->assignGlobal("headerpic", "$skindir/images/".$headerpics[rand(0, count($headerpics) - 1)]);

Now open your header.tpl file and add {headerpic} where you want your header image to display.

<img src="{skindir}/images/{headerpic}" alt="{sitename}" text="{sitename}">

In the following example, I've assigned the {headerpic} to be the background image for the banner <div> because I've also got a second image that displays the site's name in a fancy font. By putting the {headerpic} as the background, the title will float over it and center itself no matter what the screen resolution of the visitor.

<div id="banner" style='background: url({headerpic}) bottom left no-repeat;'> <img src="{skindir}/images/Title.gif" alt="{sitename}" text="{sitename}"> </div>

Ratings

	0% 0 No votes
	0% 0 No votes
	0% 0 No votes
	100% 1 vote
	0% 0 No votes