Footer Ad
Direct integration of the Footer Ad format into publisher's web pages
For all the pages where you want to plug Ogury Exclusive Demand (OED) in your website to display an Ogury Footer Ad, copy the following snippet on the placement of your choice inside the page's body.
<script type='text/javascript'>
window.top.OG_ad_units = window.top.OG_ad_units || [];
window.top.OG_ad_units.push({
ad_unit_id: '$OGURY_AD_UNIT',
asset_key: '$OGURY_ASSET_KEY',
});
</script>
<script src="https://mwtw.presage.io/v1/tag.js" async></script>
You need to replace
$OGURY_AD_UNIT and $OGURY_ASSET_KEY by the values you received during the configuration in the platform. These values are mandatory for the tag execution.Below you'll find a list of parameters for the Footer Ad format, that can be used to customize the rendering of the ad. Those parameters have to be defined in the
params object. Description | HTML Identifier that allows the Footer Ad to render in a predefined HTML container |
Prebid.js Notation | adSlotSelector |
Required | no |
Type | String |
Example Value | '#sticky-footer' |
It is possible to show the footer ad inside a predefined ad slot in your page for initial positioning.
It is mandatory that ad slot container's CSS position attribute is set to 'sticky', 'fixed' or 'absolute'.
You can enable embedding inside an ad slot by using the
ad_slot_selector parameter. It is based on the javascript querySelector method and has to be filled with the HTML element identifier of an ad slot in your page. For example, if your ad slot is defined by:<div id="ad-slot-id" class="ad-slot-class" width="100%"></div>
Then, the configuration snippet should contain:
params:{
ad_slot_selector: '#ad-slot-id'
}
Alternatively you can work with class names, but make sure that they are unique throughout the page:
params:{
ad_slot_selector: '.ad-slot-class'
}
You can also chain class names by connecting them with dots:
params:{
ad_slot_selector: '.ad-slot-class.ad-slot-class2'
}
When a footer ad is finished, the ad slot is restored to its initial position.
safe frames are currently not supported as footer ad predefined slots.
You may have elements in your web page that need to be temporarily displayed above the Footer Ad in order to allow interactions with the users (i.e, menus, modals ...).
In that case you should trigger custom Javascript events that would bring the Footer Ad to background and then to foreground again.
Example
Let's consider the case where you have a page menu identified by
burger-menu-id. You should include code similar to the following in your menu handling function in order to send the Footer Ad to the background.const burgerMenu = document.getElementById('burger-menu-id');
burgerMenu.addEventListener('click', () => {
// send the Footer Ad to background
window.top.dispatchEvent(new Event('ogy_hide'));
// show the menu
...
});
Afterwards, you should bring the Footer Ad back to foreground as follows:
const burgerMenuItem = document.getElementById('burger-menu-item-id');
burgerMenu.addEventListener('click', () => {
// update the content of some page elements
...
// bring the Footer Ad to foreground
window.top.dispatchEvent(new Event('ogy_show'));
});
If the Footer Ad creative is a video, it will stop playing on
ogy_hide event and resumed on ogy_show .Please make sure you properly use the events described above as they may impact the viewability and the performance of the ads on your web pages.
Last modified 1d ago