Random Side Banners Outside Main Body in Fixed Position

[CAG CheechDogg]

Random Side Banners

Quite a few people have asked how do you add side banners outside of your forum's main body and no one has offered a solution that I know of.

This mod allows you to have random banners outside of your forums main body in a fixed position. The banners will rotate with every unique visit to your forums similar to the dszuecs's "New way to force guests to register" Mod. The php code to make the banners rotate could possibly be written better, right now you don't always get a different random banner unless you completely close your browser and come back with a new session it seems.

The rotate.php code is not mine I found it not only in dszuecs's New way to force guests to register Mod but also online. I did however use his Mod as a base to get this Mod done.

If anyone can fix the rotate.php file so that you get a random with every page load that would be great.

The banners used in this mod have the dimensions of height:435px width:140px but you can change them to any size you want.

Included are the files to upload to your FORUMROOT using FTP:

Files included are:

1. left_banner_rotate.php
2. right_banner_rotate.php
3. images (includes 1 png file you can use as a template for your banners)
4. additional_css.txt (code to add to your additional_css)
5. header_template.txt (code to add to your header template)

You will need to make 2 manual template edits to your additional.css and your header template.

The code included in the additional_css file can be added at the very end of your additional.css file.

div.left-banner {
background:url(left_banner_rotate.php);
background-repeat: no-repeat;
display:block;
height:435px;
width:140px;
position:fixed;
left:5px;
top:50px;
}
div.right-banner {
background:url(right_banner_rotate.php);
background-repeat: no-repeat;
display:block;
height:435px;
width:140px;
position:fixed;
right:5px;
top:50px;
}

The code included in the header_template file must be added at the very top before all other code in your header template.

<div class="left-banner"></div>
<div class="right-banner"></div>

This is my first Mod contribution you guys so be gentle with me. I am just learning vBulletin's way of doing things and hopefully I can contribute other small Mods in the future.

[CAG CheechDogg]

For easier banner management you guys can use the following Mod together with this one:

https://vborg.vbsupport.ru/showthread.php?t=188328&highlight=random+images&page=137

This will allow you to set up to 10 different banners per side. To do this you do the following:

Open up your header template and do the following small edit if you already installed this Mod:

Find this:

<div class="left-banner"></div>
<div class="right-banner"></div>

Replace with this:

<div class="left-banner"><!--@vbbanners:0@--></div>
<div class="right-banner"><!--@vbbanners:2@--></div>

Note, there are 10 positions for the banners starting with 0 through 9, the 2 positions I used here are position 0 for the left side banners and position 2 for the right side banners. You can use any position you want for yours, just replace the red highlighted numbers with your positions.

This also gives you a better rotation of the your banners than using the left_banner_rotate.php and right_banner_rotate.php files, so you can remove those from your additional.css.


Change the code in additional.css to the following:

div.left-banner {
display:block;
height:435px;
width:140px;
position:fixed;
left:5px;
top:50px;
}
div.right-banner {
display:block;
height:435px;
width:140px;
position:fixed;
right:5px;
top:50px;
}

[synseal]

Excellent!, was looking for something like this.

Don't know if your aware but when I click Forum in your Navbar on your site it takes me to google.co.uk?.

[Alan_SP]

Looks good. :up:

[CAG CheechDogg]

Excellent!, was looking for something like this.

Don't know if your aware but when I click Forum in your Navbar on your site it takes me to google.co.uk?.

Glad you like it synseal! And what Forum on what Navbar buddy? I have been going crazy trying to find this link and I don't see it! lol...help me out here!

Looks good. :up:

Thanks Alan, did everything work ok for you?

[synseal]

Glad you like it synseal! And what Forum on what Navbar buddy? I have been going crazy trying to find this link and I don't see it! lol...help me out here!



Thanks Alan, did everything work ok for you?

Sorry been away for a few days,

This link on your forum redirects me to google, dont know why?.

Edit - to add so do every link in that drop down, strange.

[CAG CheechDogg]

Ah ok, you might be on an old browser that I have banned using the Ban Spiders mod which redirects them to google.com ...

What country are you in? Send me your ip address and I will see if it's in one of the ip ranges I have banned.

[synseal]

Ah ok, you might be on an old browser that I have banned using the Ban Spiders mod which redirects them to google.com ...

What country are you in? Send me your ip address and I will see if it's in one of the ip ranges I have banned.

It must have been my browser as you said cause I recently formatted my PC and you site is working fine for me now.

Sorry to take this off topic, regards :up:.

[CAG CheechDogg]

It must have been my browser as you said cause I recently formatted my PC and you site is working fine for me now.

Sorry to take this off topic, regards :up:.

No problem buddy, thanks a lot for pointing that out regardless though.

[legiondadon]

the issue i was having with this is when members had a zoomed in browser...the images wouldnt zoom with the rest of the forum and caused them to overlap over forum content for sum members...had to disable :( although this is a great idea

[CAG CheechDogg]

the issue i was having with this is when members had a zoomed in browser...the images wouldnt zoom with the rest of the forum and caused them to overlap over forum content for sum members...had to disable :( although this is a great idea

Hey legion easy fix for that. Use the following in your additional.css instead:

div.left-banner {

display:block;
height:435px;
width:140px;
position:fixed;
left:5px;
top:50px;
z-index:-1000
}
div.right-banner {

display:block;
height:435px;
width:140px;
position:fixed;
right:5px;
top:50px;
z-index:-1000;
}

The z-index:-1000 will make the banners sit behind your forum's content when zoomed in.

[Toorak Times]

Genius! I have the RBs installed, but had some crashes and trying to rebuild. Seriously...this will allow rotating ads in the spaces of the fixed themes? Have I got this right? Does it work in 4.2pl3?

[CAG CheechDogg]

Yes it should work with 4.2...and yes It will allow the rotating adds if you use the mod I listed in the description, here is the link:


https://vborg.vbsupport.ru/showthread.php?t=188328&highlight=random+images&page=137

If you need help installing it or if you are still having problems let me know.

[Toorak Times]

Thanks for your reply, I lost the thread...

I'm going to put this into action shortly for paid ads on www.tooraktimes.com.au

[ChiNa]

Liked https://vborg.vbsupport.ru/images/icons/icon14.gif CAG CheechDogg, Awesome Product, and Congrats Mate! Sadly I am not allowed to VOTE. But from 4 to 5 Stars for your work and support for your product..

I was just checking who gave me the last LIKE on my Product, And ofcourse it was from you, Once again! You are one of the greatest and honest members on here, and now as a Developer I congratulate you with your first and awesome Product! Just as you have showen your support towards myself and everyone else on here, I am now here to show my gratitude and support for your awesome work and great attitude along the time we been members on here! Good luck!

Ps, Hopefully you will be creating a few vB3.8 Products too! I mean not many are using vB3.8, but I do :p and I know many others does at well! Keep up your good work! And God bless!

By CM aka ChiNa-Man

[aaronhaul]

For easier banner management you guys can use the following Mod together with this one:

https://vborg.vbsupport.ru/showthread.php?t=188328&highlight=random+images&page=137

This will allow you to set up to 10 different banners per side. To do this you do the following:

Open up your header template and do the following small edit if you already installed this Mod:

Find this:

<div class="left-banner"></div>
<div class="right-banner"></div>

Replace with this:

<div class="left-banner"><!--@vbbanners:0@--></div>
<div class="right-banner"><!--@vbbanners:2@--></div>

Note, there are 10 positions for the banners starting with 0 through 9, the 2 positions I used here are position 0 for the left side banners and position 2 for the right side banners. You can use any position you want for yours, just replace the red highlighted numbers with your positions.

This also gives you a better rotation of the your banners than using the left_banner_rotate.php and right_banner_rotate.php files, so you can remove those from your additional.css.


Change the code in additional.css to the following:

div.left-banner {
display:block;
height:435px;
width:140px;
position:fixed;
left:5px;
top:50px;
}
div.right-banner {
display:block;
height:435px;
width:140px;
position:fixed;
right:5px;
top:50px;
}

Thank you for the "Random Side Banners Outside Main Body in Fixed Position". I have installed and it worked for just a second there with the use of the images you provided for the left and right fixed position. Then it no longer displays. Don't know why. I checked and double checked to make sure everything is ok.

After installing the above Random Side Banners, I also installed the Rotating Banner System v2.4.2 to rotate the banners as you indicated in your later post with left-banner and right banner images and the div tags:

<div class="left-banner"><!--@vbbanners:0@--></div>
<div class="right-banner"><!--@vbbanners:1@--></div>

Can you help me check what am missing out and why its not working as expected? Is it possible that there is a conflict with

I will really appreciate your effort.

Thanks.

[CAG CheechDogg]

A link to your site ? ..

Possible conflict with what? ...

Are you sure the banners are on those positions you indicated ? ...

[aaronhaul]

A link to your site ? ..

Possible conflict with what? ...

Are you sure the banners are on those positions you indicated ? ...

Hello,

Yes, the banners are on both the left and right positions as I have followed your directions closely.

But I do not know whether I mistakenly broke something or some of the scripts conflicting.

Please help me check?

I'm sending you a Link to the Website including Logging Information via my inbox.

Thanks a lot.

[CAG CheechDogg]

Ok buddy, I got it going ...now all you have to do is add more banners to the positions that you have in the banner rotator, follow the examples for the ones you have now ....

Right now you only have the image I use for the template, but you can replace that with what ever images you upload to any folder, just make sure they are the dimensions you specify ...

[CAG CheechDogg]

If you need to add a banner with a link in it use the following:

<a href="http://naijafrontpage.hugeicon.com/forum.php" title="tittle for your link"><img src="http://naijafrontpage.hugeicon.com/path_to/image" border="0" alt="your choice" title="your choice" width="140" height="435" /></a>

[aaronhaul]

If you need to add a banner with a link in it use the following:

<a href="http://naijafrontpage.hugeicon.com/forum.php" title="tittle for your link"><img src="http://naijafrontpage.hugeicon.com/path_to/image" border="0" alt="your choice" title="your choice" width="140" height="435" /></a>

Yes I tried that. I think I'll stick to not putting a banner on the header_1 and header_2 of this custom theme as it makes it looks ugly.

Nevertheless, I'm trying to add Random Side Banner with Add Banner Rotators on Blog Sidebar, but it's not working.

It doesn't show up the banner on the Blog Sidebar although the Blog Sidebar banners are active.

I've checked the position of the templates, the RBS and Advertisement positions. Everything looks OK. But the banner do not display in the Side Bar of Blog.

Please advise.

[Toorak Times]

Hi, I tried the positions you suggested and the banners appeared at the top of the page not the sides, not sure at all how the positioning of these works.
www.tooraktimes.com.au

Is there an explanation anywhere that tells you where all these positions directly relate to in the advertisinf grids on the site?

[RichieBoy67]

Thanks Cheech! I was just working on this very thing! Now I don't have too. :)

[CAG CheechDogg]

Thanks Cheech! I was just working on this very thing! Now I don't have too. :)

Nice Richie ! Did it do the job for you?

[Toorak Times]

Hi Cheech,

Can I get you to give me some help please, I can only get these to appear at the top of the skin mate

[CAG CheechDogg]

Which option did you use? A link to your site?

[Toorak Times]

Which option did you use? A link to your site?

http://www.tooraktimes.com.au/content.php/3611-TAGG-The-Alternative-Gig-Guide-Australia

I see the adds appearing above the header instead of beside the fixed skin

[CAG CheechDogg]

I see the code at the top of your page ... you uploaded the files to your forum root and added the code to the header template and additional.css file?

[Toorak Times]

I see the code at the top of your page ... you uploaded the files to your forum root and added the code to the header template and additional.css file?

I tried again today but it drops the ads above the Navbar on the same side. I believe I have done everything as required mate, I used the rotating banner option

[CAG CheechDogg]

Do you have a link to your site so I can take a look?

[Toorak Times]

Do you have a link to your site so I can take a look?

www.tooraktimes.com.au

[CAG CheechDogg]

Do you have it installed on a particular style?

[Toorak Times]

Do you have it installed on a particular style?

No mate, a LOT of mods though

[mangmel]

thanks..............

[RichieBoy67]

No mate, a LOT of mods thoughI haven't looked into the entire issue but from a quick peek at your site I see a pretty severe horizontal scroll. Probably not noticeable with high res screens but noticeable on my laptop using 1920 resolution.

[yjmalmsteen]

Great mod, thanks!
But can i use it without rotating option?and how?
I have to use still images there.
Thanks

[TheLastSuperman]

Great mod, thanks!
But can i use it without rotating option?and how?
I have to use still images there.
Thanks

You *should* be able to with some small changes...

So take this:
div.left-banner {
background:url(left_banner_rotate.php);
background-repeat: no-repeat;
display:block;
height:435px;
width:140px;
position:fixed;
left:5px;
top:50px;
}
div.right-banner {
background:url(right_banner_rotate.php);
background-repeat: no-repeat;
display:block;
height:435px;
width:140px;
position:fixed;
right:5px;
top:50px;
}

Change to:
div.left-banner {
background:#ffffff;
display:block;
height:435px;
width:140px;
position:fixed;
left:5px;
top:50px;
}
div.right-banner {
background:#ffffff;
display:block;
height:435px;
width:140px;
position:fixed;
right:5px;
top:50px;
}

*Now the rotating .php file is no longer the background and it's just a white background :D.

Now take this:
<div class="left-banner"></div>
<div class="right-banner"></div>

And change it, you must add in your ad/banner codes or anything you want shown inside the div tags, here is an example:
<div class="left-banner">
NEW CODE HERE IF ADS OR BANNERS INCLUDING Google Ads/Ebay Partnership Ads/Openx or Revive Ad Server codes go HERE.
</div>
<div class="right-banner">
<a href="www.vbulletin.org" target="_blank"><img src="images/mybannerimage.png" alt="My Banner Title" /></a>
</div>

The top you could paste ad/banner codes in between the div tags, on the bottom "right-banner" I simply showed a basic ahref tag wrapped around an image i.e. a clickable banner which is very simple to do, this is also an example of what you said is a "still image" but it's linked to a site ;).

To adjust width/height simply change the following lines:
height:435px;
width:140px;

To the new values i.e. if it's a 300x250 ad simply change those to that, otherwise you could use 100% value instead of 435px (if it's too big then the div wrapping this does not have height defined or rather it's not inherited etc).

Let me know if this works for you or what didn't work :cool:.

[CAG CheechDogg]

Thanks SP ..... just saw this .....

[MarkFL]

Thanks SP ..... just saw this .....

I would be willing to automate the CSS and header template edits, and add some product settings to allow the user to define the size of the banners if you want. If you are interested, shoot me a PM with your email addy, and I will send you the revised product. :)

[CAG CheechDogg]

I would be willing to automate the CSS and header template edits, and add some product settings to allow the user to define the size of the banners if you want. If you are interested, shoot me a PM with your email addy, and I will send you the revised product. :)


Go ahead and handle business Mark ... release it for all to enjoy my Man ...

[deltamarkets]

Hello,

We are the new oweners of a vbulletin board. I try install your mod but I m stuck in uploading the xml file. Can you or someone help me with this?

[CAG CheechDogg]

There is no xml file for this mod ....

[MarkFL]

Go ahead and handle business Mark ... release it for all to enjoy my Man ...

I wanted you to retain authorship of this, since you put everything together. I have simply taken your work and made it into a product, where no manual template edits are needed.

The user has the option to disable it, and to define the dimensions of the banners, and the margins between the banners and the body.

Please review this, let me know of any changes you would like, and then when you are happy with it, release it as a mod rather than a template modification. :)

[CAG CheechDogg]

I wanted you to retain authorship of this, since you put everything together. I have simply taken your work and made it into a product, where no manual template edits are needed.

The user has the option to disable it, and to define the dimensions of the banners, and the margins between the banners and the body.

Please review this, let me know of any changes you would like, and then when you are happy with it, release it as a mod rather than a template modification. :)

Did you put the option to use this mod as well so that they could use it more easily?

https://vborg.vbsupport.ru/showthread.php?t=188328&highlight=random+images&page=137

So they could do the following?

Find this:

Code:

<div class="left-banner"></div>
<div class="right-banner"></div>

Replace with this:

Code:

<div class="left-banner"><!--@vbbanners:0@--></div>
<div class="right-banner"><!--@vbbanners:2@--></div>

[MarkFL]

No, I didn't know about that...I just used the HTML from the first post in the thread. It looks like an HTML comment, so I could simply add it to the HTML already being added, and it they need it it's there, if not it doesn't hurt anything...right? :)

[MarkFL]

In order to offer the greatest flexibility, I added two settings, consisting of textareas into which the user can enter the exact HTML they want for the left and right banners. The default values are what you have given in your first post, and then they can add to that or edit it as they see fit. :)

[scottkoz20]

this modification is going to allow me to re-design the look of my site entirely

Love this!

[CAG CheechDogg]

Glad you like it ... post your site's link so we can see the before and after ... if you don't mind that is lol ...

[scottkoz20]

will do - I have start work on my dev enviroment

dev.sportscardforum.com - still needs work in order to get it ready to move over...