Placing Ads outside the "body"

[Zweeper]

Hey, I am trying to place Ads outisde the body, for example within the red marked zone in the picture. It should be on the right side there.


There is already a thread on vbulletin.com, but the guys couldnt help me.
Is here anyone who already did something like that to place skyscraper and wallpaper ads in a fashioned way? https://www.vbulletin.com/forum/forum/vbulletin-5-connect/vbulletin-5-connect-questions-problems-troubleshooting/vbulletin-5-support-issues-questions/4406573-ads-on-the-right-side


Would appreciate any help. Also donations from my side possible!





https://vborg.vbsupport.ru/external/2019/01/5.jpg

[delicjous]

This is only an example, so you have to edit it to fit your own needs:

First make a new template (examplename: skyscraper):

Put the following content in it:

<style>
.skywrapper {
position: relative;
width: {vb:stylevar wrapper_max_width};
margin: auto;
}
.skyscraper {
position: absolute;
right: 0px;
margin-right: -160px;
}
@media only screen and (max-width:1520px) {
.skywrapper {
display:none;
}
}
</style>

<div class="skywrapper">
<div class="skyscraper"><img src="/images/skyscraper.png"></div>
</div>

Second, create a hook for your template and choose the template-hook "header_before_notices".

If your forum wrapper have a 1200px max-width and your skyscraper have a 160px witdh it should work now. If not you have to edit @media only [wrapper-width + (skyscraper-width * 2)]

In my example 1520px = 1200 wrapper and 160px skyscraper * 2

Thats it!

If you have a full width forum you should use a 3 column-layout.

Would be nice to see you at my forum, there are some other add-ons, exapmles...

[Zweeper]

Danke f?r die Tipps, h?tte ich ja gleich deutsch schreiben k?nnen ;)

Ich werde das mal testen und definitiv dein Forum besuchen! :)





Gr??e!

[Zweeper]

This is only an example, so you have to edit it to fit your own needs:

First make a new template (examplename: skyscraper):

Put the following content in it:

<style>.skywrapper { position: relative; width: {vb:stylevar wrapper_max_width}; margin: auto;}.skyscraper { position: absolute; right: 0px; margin-right: -160px;}@media only screen and (max-width:1520px) { .skywrapper { display:none; }}</style><div class="skywrapper"><div class="skyscraper"><img src="/images/skyscraper.png"></div></div>Second, create a hook for your template and choose the template-hook "header_before_notices".

If your forum wrapper have a 1200px max-width and your skyscraper have a 160px witdh it should work now. If not you have to edit @media only [wrapper-width + (skyscraper-width * 2)]

In my example 1520px = 1200 wrapper and 160px skyscraper * 2

Thats it!

If you have a full width forum you should use a 3 column-layout.

Would be nice to see you at my forum, there are some other add-ons, exapmles...






Hey delicjous, I will answer you with respect to the english speaking community here. First of it all, I want to really thank you since your tip just brought me a big step further to my aim. Your code is working and did exactly what I wanted.



Maybe you can give me another useful hint, since I want to integrate also a wallpaper/leaderboard ad to my site.



My aim is to place the wallpaper ad directly below the very top navbar (the one with the private messages and profile links). But that doesnt seem to work with any hook position, since then the banner ?s overlaying or messing with the top design (you can see an example on the third picture).



You can see the actual position on the pic below. The ad should be between the logo & search bar and the very top navbar. Right now the ad is on the very top above all (I positioned the hook at "header after body begin").



Unfortunately every other hook position wont work since the design gets messed or elements repositioned. In the "worst" case, I would also be okay if just the width of the very top navbar would be the same as my forum (1300 px) but until now I couldnt find any option to change the width of this navbar element.


Kind regards from germany,

zweeper

[Zweeper]

Forgot the pic :)

[delicjous]

Will look into it when I get some minutes and write a tutorial at https://vbulletin-forum.de/articles/dokumentationen

[Zweeper]

*like* :)

[In Omnibus]

Purely in the interest of accuracy I would suggest this be renamed "placing ads outside the wrapper" as ads cannot be placed outside the body.

[delicjous]

Purely in the interest of accuracy I would suggest this be renamed "placing ads outside the wrapper" as ads cannot be placed outside the body.

Because you want to know exactly ... it's not the wrapper either. It's in the wrapper and outside the content. :p:D:up:

[In Omnibus]

Because you want to know exactly ... it's not the wrapper either. It's in the wrapper and outside the content. :p:D:up:

:) I didn't look at the code to see how you went about it. I only know you can't place anything outside the body tags. Not if you want it to be visible.