Simple logo rotator

ufo · 07.02.2005, 15:06

There is a simple way to add a radom logo to your page.

Create a few logos with the same height and width.
Upload them in the images folder of your template.
Name them "logo1.jpg, logo2.jpg" and so on.
Modify the line with the img source in the index.php of your template like this:

PHP Code:

 
<img src="<?php echo $mosConfig_live_site; ?>/templates/your template/images/logo<?php echo rand(1,5)?>.jpg" />

This line displays 5 different logos!
Modify the (1,5) to (1,10) to rotate randomly 10 logos.

-peter- · 07.02.2005, 17:05

Thx for this little Tut

Jifor · 08.02.2005, 20:10

I'm going to copy this to the faq section. Good stuff!

ufo · 14.02.2005, 13:01

Quote:

Originally Posted by Jifor

I'm going to copy this to the faq section. Good stuff!

Thank you, I think the meaning of this community is to make knowledge available to all. Maybe others will join this ideea.

walkeraj · 15.02.2005, 00:43

I was working on a website for a nonprofit client, and I wanted a simple banner at the top of the page to rotate between a few different images. Yours fit the bill for simplicity and ease-of use, but flaws in IE prevented me from being able to use it correctly due to the fact that IE improperly rendered whitespace at the bottom of my banner div unless the image was the background image.

I solved the problem by using your code snippet and altering it somewhat so that it could be used in multiple templates with no modification.

Here's what I did:

PHP Code:

 
<div style="height:180px; width:770px; background: url(<?php echo "templates/$cur_template/images/banners/banner",rand(1,2),".jpg" ?>) no-repeat; ">

So long as you have an images/banners directory in your template directory, this little snippet will return a valid image in that directory without requiring an explicit pathname. This will allow for easy copying of your template, because the path will be calculated each time.

The height and width of the banner must be explicitly set, of course, but what a payoff.

trench · 17.02.2005, 13:19

how can I accomplish this same feat using css? My banner is called via css? What changes must be made?

eyezberg · 17.02.2005, 14:10

the above style declaration IS css..?!

ufo · 17.02.2005, 14:14

I think the only way is to change the template to use the banner in php, the css is not processed by the server but only by the browser.

Eliminate the banner from the css and try to implement-it in the index.php file of your template.

If there is a way to do this (the rotator) using css it will be a great addition to the knowledge base.

trench · 18.02.2005, 08:18

Quote:

Originally Posted by eyezberg

the above style declaration IS css..?!

This is what Im using to produce my banner image.

Quote:

#header {
float: left;
padding: 0px;
margin: 0px;
width: 802px;
height: 150px;
background: url(../images/banner.jpg) no-repeat;
}

doctorj · 14.03.2005, 17:58

Anyone able to get this to work in CSS? I have tried a few modifications and had no luck. If anyone gets this working I think it would be a great resource for the community.

Thanks,