Rotating Banners for your TP forum! (Works for FF and IE)

[ash]

This may not be new to some of you, but it’s me trying to give back to this community who has given me so much.

These codes allow you to have a rotating banner on the very top of your forum.  So, each time an action is performed on the forum, the banner will change to one you have predefined.  This works good if you remove the default theme banner first, or just replace it with a blank picture so you don’t have two banners going at the same time ^^

You can see how it looks on my forum here:  http://thegamedomain.org/tgdmain    NO PW needed

First thing is to create your banners.  Make sure that all the banners are the same width and height so that the transition doesn’t look goofy.  If you have a black or white background on your forum, just use those colors to fill in the extra space if you banners are not the same size.

For my banners, I have created four at 1050 x 158, all with black backgrounds to match my forum.

Now to make it all happen

First you need a webpage with the rotating image code in a Div layer that eliminates the spaces at the top and left of the page (Set left and top to 0px).  Lucky for you, I have attached that page for you.  All you need to do is edit it to have the image URL’s match your own and change the background of the page to whatever matches your forum. (I’ve also attached the rotate script without the webpage.)

Simply open the webpage up, view the code and change the URL’s and background color.  Then save it.  If you don’t rename it, you don’t have to change the name of the page in the IFrame code below.

Ok, next step.
   
1.   Go to your admin panel in your forum and choose “Current Theme”
2.   Search for </head>
3.   Right above </head> add the code in the attached file called “Preload”.  This is; you guessed it, a code that will preload all your images so that the load time on your forum isn’t much affected.  Make sure that you change the image URL’s to where your banners are actually stored and call the images something different.
4.   After </head> paste the IFrame code (Below).  Make sure if you renamed the webpage I attached here to also change the name in the IFrame code.
5.   Hit save.  (oh yea, make sure you upload the webpage to your server somewhere and fix the URL in the IFrame to match ^^ )


That’s it.  You should now have a rotating banner at the very top of your forum.


I believe I’ve covered all the steps here.  I pretty much suck at writing things up for other people to understand, so if I missed something, feel free to slap me around in your reply and I will correct.

Hope this works out for you and you get some use out of it.
Works in Firefox but make sure to put the center tags around your IFrame <center>Iframe</center>


IFRAME CODE (Modify as needed):

Code Select Expand

<iframe name="I1" id="I1" src="http://thegamedomain.org/banners/test.htm" marginwidth="1050" marginheight="158" scrolling="no" border="0" frameborder="0" style="width: 1052px; left: 0px; right: 0px" height="158">Your browser does not support inline frames or is currently configured not to display inline frames.
</iframe>



Take Care,
Ash
www.thegamedomain.com

[Reality12]

sounds exactly like something i want on my forum, but i've got an error when i try to implement it.

Code Select Expand

The file you tried to save generated the following error:
Parse error: syntax error, unexpected '>' in index.template.php on line 252

i've also uploaded the 'test' page into my forum root directory and changed the names accordingly.

here's what the code i've pasted looks like:

Code Select Expand

<SCRIPT language="JavaScript">
<!--
if (document.images)
{
  adBanner1= new Image(856,179);
  adBanner1.src="MY IMAGE URL";


  adBanner2= new Image(856,179);
  adBanner2.src="MY IMAGE URL";

}
//-->
</SCRIPT>
<script language="JavaScript">
<!-- Begin
rnd.today=new Date();
rnd.seed=rnd.today.getTime();
function rnd() {
        rnd.seed = (rnd.seed*9301+49297) % 233280;
        return rnd.seed/(233280.0);
};
function rand(number) {
   var result = Math.ceil(rnd()*number);
   if (!result)result++;
        return result
};
var ad_cnt1 = 4;
var ad1 = rand(ad_cnt1);
var link1;
var adBanner1;
var width1
var height1
if (ad1==1) {
adBanner1="MY IMAGE URL";
width1="856";
height1="179";
alt1="MY WEBSITE NAME";
}
if (ad1==2) {
adBanner1="MY IMAGE URL";
width1="856";
height1="179";
alt1="MY WEBSITE NAME";
}
document.write('<center><a href="' + link1 + '" target="_top">');
document.write('<img src="' + adBanner1 + '" width=' + width1 + ' height=' + height1 + ' border=0 alt="' + alt1 + '"></a>');
document.write('</center>');
// End -->
</SCRIPT>
</head>

what have i done wrong?

[Reality12]

here's what the 'test' page has:

Code Select Expand



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled 1</title>
</head>

<body style="background-color: #000000">


<div style="position: absolute; width: 1050px; height: 158px; z-index: 1; left: -1px; top: -1px" id="layer1">
<table style="width: 100%">
<tr>
<td>
<script language="JavaScript">
<!-- Begin
rnd.today=new Date();
rnd.seed=rnd.today.getTime();

function rnd() {
        rnd.seed = (rnd.seed*9301+49297) % 233280;
        return rnd.seed/(233280.0);
};

function rand(number) {
var result = Math.ceil(rnd()*number);
if (!result)result++;
        return result
};
var ad_cnt1 = 4;
var ad1 = rand(ad_cnt1);
var link1;
var adBanner1;
var width1
var height1
if (ad1==1) {
adBanner1="MY IMAGE URL";
width1="856";
height1="179";
alt1="MY WEBSITE NAME";
}
if (ad1==2) {
adBanner1="MY IMAGE URL";
width1="856";
height1="179";
alt1="MY WEBSITE NAME";
}
document.write('<center><a href="' + link1 + '" target="_top">');
document.write('<img src="' + adBanner1 + '" width=' + width1 + ' height=' + height1 + ' border=0 alt="' + alt1 + '"></a>');
document.write('</center>');
// End -->
</SCRIPT>
&nbsp;</td>
</tr>
</table>
</div>


</body>

</html>


[Reality12]

can anyone help with this?

[IchBin]

Did you follow the instructions above? Put it in your template file like suggested with the iframe code? Sounds like you're not doing it that way.

[b33znutz]

this is what ive been lookin for! gonna try this! even though its like a year later, i will post my findings. thanks ash!

[b33znutz]

i got the same prob. parse error.. and mine ended up more or less like ~Alex's did.... and zero support. wish i knew code. the author hasnt been around since oct of last year.. redicluous. im frustrated if u cant tell.......grrrrrrrrrrrrrrrrrrrrr

[JPDeni]

What code did you use? Exactly? Please post it, using [ code ] tags. What kind of block did you put it in?

[nstutsman]

I use a php script to rotate banners.  No issues, just put the php in a folder with all the banners you want to rotate.  Just point the image location to the file, i.e. on my site http://geeksbling.com, the banner is pointed to http://geeksbling.com/squad/headerbgs/index.php.  I have about 17 banners in there, it randomly rotates among all of them.  I even have additional folders in there, for different events (xmas, etc.)  Just dump all the normal banners into a temp dump, and move the seasonal ones into the main folder.

This isn't my script, so I won't take credit.  But it works for an idiot like me, so it's gotta work for you

[ash]

Sorry for the absence.  Thanks b33znutz for letting me know I needed to come back here to reply.

Seems I made a typo in the above instructions where I stated to paste the IFRAME code inside the head instead of right after the head (D’oH!). 
I have corrected the above instructions.

Keep in mind; you don't paste the code from the .htm file in the index template, just the IFRAME code and the preload code, if you want to. (IMO its not really needed)

To simplify things, create a folder on you host called banners or whatever; put all your images and the test.htm file in there (This is what I’ve done).
Then just paste in the IFRAME code immediately AFTER </head>.

1. So, :find:  </head>

2. Paste after: </head>

Code Select Expand

<iframe name="I1" id="I1" src="http://thegamedomain.org/banners/test.htm" marginwidth="1050" marginheight="158" scrolling="no" border="0" frameborder="0" style="width: 1052px; left: 0px; right: 0px" height="158">Your browser does not support inline frames or is currently configured not to display inline frames.
</iframe>



This is where I pasted mine.   (After </head> and before <body>)  Your banners will then be at the tippy-top of your forum 

</head>
<iframe name="I1" id="I1" src="http://thegamedomain.org/banners/test.htm" marginwidth="1050" marginheight="158" scrolling="no" border="0" frameborder="0" style="width: 1052px; left: 0px; right: 0px" height="158">Your browser does not support inline frames or is currently configured not to display inline frames.
</iframe>
<body>



I’m using the code in my forum again, so you can see it and copy the source code if needed.  I’ll remove it here after the week is over.
Thegamedomain.org â€" select the Community Forum link, not the WoWarcraft link 


Sorry for any inconveniences.
<3 Ash