# Adverline Ad Tags integration overview
The purpose of this document is to give you an overview of our proposed AdTags integration.
If everything seems good for you, we will provide a more detailed version (with our new adunits names and more detailed integration code if needed).
## Tagging procedure
First of all, on each page we will separate Adslots in two types :
- Adslosts known and called at page load
- Dynamic Adslots called on page scroll
<br>
### Adslots known and called at page load
This script portion goes to the ```<HEAD>``` section of the page and gives you an example for two Adslots `slot_name1` and `slot_name2`, respectively displayed in `div_id1` and `div_id2`:
* `ADVERLINE` namespace declaration
* List of all `div_id` names in `ADVERLINE.dfpAdUnits`
* List of all global targeting key/value pairs in `ADVERLINE.data`
* `ADVERLINE.onReady` function :
* `googletag` activation
* Adslots declaration
* `sizeMapping` definition
* `pubads` slot settings, **including** slot-level targeting
* `pubads` global settings, **excluding** global targeting
* `enableServices`
* Adverline PREBID WRAPPER synchronous call
```javascript=
<script>
ADVERLINE = window.ADVERLINE || { dfpAdUnits: [], data: {}};
// declare all Adslots div_ids
ADVERLINE.dfpAdUnits = [
div_id1,
div_id2,
];
// add global targeting key/value pairs if needed
// We propose to always send device type as global key/value pair
// section is used to identify the current page type "homepage" for example
// Next lines are equivalent to :
// googletag.pubads().setTargeting("device", "desktop");
// googletag.pubads().setTargeting("section", "current_section");
ADVERLINE.data.device = "desktop";
ADVERLINE.data.section = "current_section";
// googletag activation and adslots definitions
// are made inside our ADVERLINE.onReady function
window.ADVERLINE.onReady = () => {
window.googletag.cmd.push(() => {
googletag
.defineSlot("slot_name1", [[1, 1], [728, 90], [320, 100], [320, 50], [300, 50]], "div_id1")
.defineSizeMapping(
googletag.sizeMapping()
.addSize([768, 0], [[1, 1], [728, 90]])
.addSize([320, 0], [[1, 1], [320, 100], [320, 50], [300, 50]])
.addSize([0, 0], [])
.build()
)
//Adunit specific Key/Value
.setTargeting("ms_banner_name", "slot_name2")
.addService(googletag.pubads());
googletag
.defineSlot("slot_name2", [[1, 1], [728, 90], [320, 100], [320, 50], [300, 50]], "div_id2")
.defineSizeMapping(
googletag.sizeMapping()
.addSize([768, 0], [[1, 1], [728, 90]])
.addSize([320, 0], [[1, 1], [320, 100], [320, 50], [300, 50]])
.addSize([0, 0], [])
.build()
)
//Adunit specific Key/Value
.setTargeting("ms_banner_name", "slot_name2")
.addService(googletag.pubads());
// global settings for all ad slots
googletag.pubads().collapseEmptyDivs();
googletag.pubads().setCentering(true);
// mandatory settings
googletag.pubads().enableSingleRequest();
googletag.enableServices();
}
}
</script>
// Include our wrapper synchronously
<script src="https://cdn.adnext.fr/wrapper/motorsport.com.js"></script>
```
Our wrapper activates the ```disableInitialLoad``` property, so that the ads are only displayed by our call to the refresh function (after all bids are made).
On the ```<BODY>``` section of the page, adslots divs' declarations and `googletag.display` calls are standard.
```javascript=
<div id="div_id">
<script>
googletag.cmd.push(function() {
googletag.display("div_id1");
});
</script>
</div>
```
<br>
### Dynamic Adslots called on page scroll
Those Adslots are not declared inside the ```<HEAD>``` section of the page,
they are loaded during page navigation
* Instead of the classic call:
```javascript=
<div id="div_id">
<script>
googletag.cmd.push(function() {
// Adslot definition
var slot = googletag
.defineSlot("slot_name", [[1, 1], [728, 90], [320, 100], [320, 50], [300, 50]], "div_id")
.defineSizeMapping(
googletag.sizeMapping()
.addSize([768, 0], [[1, 1], [728, 90]])
.addSize([320, 0], [[1, 1], [320, 100], [320, 50], [300, 50]])
.addSize([0, 0], [])
.build()
)
.addService(googletag.pubads());
// call to display
googletag.display("div_id");
// refresh
googletag.pubads().refresh(slot);
});
</script>
</div>
```
* You'll have to call our own functions :
* This example show you how to add a slot `slot_nameX` in the div `div_idX`
```javascript=
<div id="div_idX">
<script>
window.googletag.cmd.push(() => {
// Adslot definition
googletag
.defineSlot("slot_nameX", [[1, 1], [728, 90], [320, 100], [320, 50], [300, 50]], "div_idX")
.defineSizeMapping(
googletag.sizeMapping()
.addSize([768, 0], [[1, 1], [728, 90]])
.addSize([320, 0], [[1, 1], [320, 100], [320, 50], [300, 50]])
.addSize([0, 0], [])
.build()
)
//Adunit specific Key/Value
.setTargeting("ms_banner_nameX", "slot_nameX")
.addService(googletag.pubads());
// call to display
googletag.display("div_idX");
// Pass the div id to our services
ADVERLINE.addAdUnits("div_idX");
// refresh with our own refreshAdUnits method
// !! IMPORTANT : We use the id whereas gpt uses the Adslot object
ADVERLINE.refreshAdUnits("div_idX");
});
</script>
</div>
```
<br>
### Adverline Adunits Naming For Motorsport
<br>
<table border="0" style="font-size:11px">
<tr>
<td><b style="font-size:16px">Publisher's Adunit</b></td>
<td><b style="font-size:16px">Adverline Adunit Code</b></td>
<td><b style="font-size:16px">Adunit specific Key/Value</b></td>
</tr>
<tr>
<td>/6122441/MST/fr/Super</td>
<td>/162547629/motorsport/super</td>
<td>ms_banner_position=top</td>
</tr><tr>
<td>/6122441/MST/fr/Leaderboard</td>
<td>/162547629/motorsport/leaderboard</td>
<td>ms_banner_position=top</td>
</tr><tr>
<td>/6122441/MST/fr/Mobile_leaderboard</td>
<td>/162547629/motorsport/mobile_leaderboard</td>
<td>ms_banner_position=top</td>
</tr><tr>
<td>/6122441/MST/fr/Super</td>
<td>/162547629/motorsport/super</td>
<td>ms_banner_position=middle</td>
</tr><tr>
<td>/6122441/MST/fr/Leaderboard</td>
<td>/162547629/motorsport/leaderboard</td>
<td>ms_banner_position=middle</td>
</tr><tr>
<td>/6122441/MST/fr/Rectangle</td>
<td>/162547629/motorsport/rectangle</td>
<td>ms_banner_name=rectangle_first or ms_banner_name=rectangle-first (on AMP) or version=webmobile (on webmobile)</td>
</tr><tr>
<td>/6122441/MST/fr/DMPU</td>
<td>/162547629/motorsport/dmpu</td>
<td>ms_banner_name=dmpu_first or version=webmobile (on webmobile)</td>
</tr><tr>
<td>/6122441/MST/fr/DMPU</td>
<td>/162547629/motorsport/dmpu</td>
<td>ms_banner_name=dmpu or version=webmobile (on webmobile)</td>
</tr><tr>
<td>/6122441/MST/fr/Native</td>
<td>/162547629/motorsport/native</td>
<td>ms_native=1</td>
</tr><tr>
<td>/6122441/MST/fr/Native</td>
<td>/162547629/motorsport/native</td>
<td>ms_native=2</td>
</tr><tr>
<td>/6122441/MST/fr/Super</td>
<td>/162547629/motorsport/super</td>
<td>ms_banner_position=popup_gallery_top</td>
</tr><tr>
<td>/6122441/MST/fr/Mobile_leaderboard</td>
<td>/162547629/motorsport/mobile_leaderboard</td>
<td>ms_banner_position=popup_gallery_top</td>
</tr><tr>
<td>/6122441/MST/fr/DMPU</td>
<td>/162547629/motorsport/dmpu</td>
<td>ms_banner_position=popup_gallery_dmpu or version=webmobile (on webmobile)</td>
</tr><tr>
<td>/6122441/MST/fr/Rectangle</td>
<td>/162547629/motorsport/rectangle</td>
<td>ms_page_type=detail-amp or version=webmobile (on webmobile)</td>
</tr><tr>
<td>Mobile_Rectangle</td>
<td>/162547629/motorsport/mobile_rectangle</td>
<td>version=webmobile (on webmobile) and any relevant ms_banner_position value</td>
</tr>
</table>
### Adverline Adunits Naming For Motor1
#### This part of the previous code example must be modified
``` html=
// Include our wrapper synchronously
<script src="https://cdn.adnext.fr/wrapper/motor1.com.js"></script>
```
<br>
<table border="0" style="font-size:11px">
<tr>
<td><b style="font-size:16px">Publisher's Adunit</b></td>
<td><b style="font-size:16px">Adverline Adunit Code</b></td>
<td><b style="font-size:16px">Adunit specific Key/Value</b></td>
</tr>
<tr>
<td>/6122441/M1/fr/Super</td>
<td>/162547629/motor1/super</td>
<td>m1_banner_position=top</td>
</tr><tr>
<td>/6122441/M1/fr/Leaderboard</td>
<td>/162547629/motor1/leaderboard</td>
<td>m1_banner_position=top</td>
</tr><tr>
<td>/6122441/M1/fr/Mobile_leaderboard</td>
<td>/162547629/motor1/mobile_leaderboard</td>
<td>m1_banner_position=top</td>
</tr><tr>
<td>/6122441/M1/fr/Super</td>
<td>/162547629/motor1/super</td>
<td>m1_banner_position=middle</td>
</tr><tr>
<td>/6122441/M1/fr/Leaderboard</td>
<td>/162547629/motor1/leaderboard</td>
<td>m1_banner_position=middle</td>
</tr><tr>
<td>/6122441/M1/fr/Rectangle</td>
<td>/162547629/motor1/rectangle</td>
<td>m1_banner_place=rectangle_first or version=webmobile (on webmobile)</td>
</tr><tr>
<td>/6122441/M1/fr/DMPU</td>
<td>/162547629/motor1/dmpu</td>
<td>m1_banner_place=dmpu_first or version=webmobile (on webmobile)</td>
</tr><tr>
<td>/6122441/M1/fr/DMPU</td>
<td>/162547629/motor1/dmpu</td>
<td>m1_banner_place=dmpu or version=webmobile (on webmobile)</td>
</tr><tr>
<td>/6122441/M1/fr/Native</td>
<td>/162547629/motor1/native</td>
<td>m1_native=1 or ms_native=2</td>
</tr><tr>
<td>/6122441/M1/fr/Super</td>
<td>/162547629/motor1/super</td>
<td>m1_banner_position=popup_gallery_top</td>
</tr><tr>
<td>/6122441/M1/fr/Leaderboard</td>
<td>/162547629/motor1/Leaderboard</td>
<td>m1_banner_position=popup_gallery_top</td>
</tr><tr>
<td>/6122441/M1/fr/DMPU</td>
<td>/162547629/motor1/dmpu</td>
<td>m1_banner_position=popup_gallery_rectangle or version=webmobile (on webmobile)</td>
</tr><tr>
<td>/6122441/M1/fr/Rectangle</td>
<td>/162547629/motor1/rectangle</td>
<td>m1_banner_place=amp_gallery or version=webmobile (on webmobile)</td>
</tr><tr>
<td>/6122441/M1/fr/Rectangle</td>
<td>/162547629/motor1/rectangle</td>
<td>m1_page_type=detail-amp</td>
</tr><tr>
<td>Mobile_Leaderboard</td>
<td>/162547629/motor1/mobile_rectangle</td>
<td>version=webmobile (on webmobile)</td>
</tr>
</table>
### Adverline Adunits Naming For Insideevs
#### This part of the previous code example must be modified
``` html=
// Include our wrapper synchronously
<script src="https://cdn.adnext.fr/wrapper/insideevs.fr.js"></script>
```
<br>
<table border="0" style="font-size:11px">
<tr>
<td><b style="font-size:16px">Publisher's Adunit</b></td>
<td><b style="font-size:16px">Adverline Adunit Code</b></td>
<td><b style="font-size:16px">Adunit specific Key/Value</b></td>
</tr>
<tr>
<td>/6122441/EV/fr/Super</td>
<td>/162547629/insideevs/super</td>
<td>m1_banner_position=top</td>
</tr><tr>
<td>/6122441/EV/fr/Leaderboard</td>
<td>/162547629/insideevs/leaderboard</td>
<td>m1_banner_position=top</td>
</tr><tr>
<td>/6122441/EV/fr/Mobile_leaderboard</td>
<td>/162547629/insideevs/mobile_leaderboard</td>
<td>m1_banner_position=top</td>
</tr><tr>
<td>/6122441/EV/fr/Super</td>
<td>/162547629/insideevs/super</td>
<td>m1_banner_position=middle</td>
</tr><tr>
<td>/6122441/EV/fr/Leaderboard</td>
<td>/162547629/insideevs/leaderboard</td>
<td>m1_banner_position=middle</td>
</tr><tr>
<td>/6122441/EV/fr/Rectangle</td>
<td>/162547629/insideevs/rectangle</td>
<td>m1_banner_place=rectangle_first or version=webmobile (on webmobile)</td>
</tr><tr>
<td>/6122441/EV/fr/DMPU</td>
<td>/162547629/insideevs/dmpu</td>
<td>m1_banner_place=dmpu_first or version=webmobile (on webmobile)</td>
</tr><tr>
<td>/6122441/EV/fr/DMPU</td>
<td>/162547629/insideevs/dmpu</td>
<td>m1_banner_place=dmpu or version=webmobile (on webmobile)</td>
</tr><tr>
<td>/6122441/EV/fr/Native</td>
<td>/162547629/insideevs/native</td>
<td>m1_native=1 or ms_native=2</td>
</tr><tr>
<td>/6122441/EV/fr/Super</td>
<td>/162547629/insideevs/super</td>
<td>m1_banner_position=popup_gallery_top</td>
</tr><tr>
<td>/6122441/EV/fr/Leaderboard</td>
<td>/162547629/insideevs/Leaderboard</td>
<td>m1_banner_position=popup_gallery_top</td>
</tr><tr>
<td>/6122441/EV/fr/DMPU</td>
<td>/162547629/insideevs/dmpu</td>
<td>m1_banner_position=popup_gallery_rectangle or version=webmobile (on webmobile)</td>
</tr><tr>
<td>/6122441/EV/fr/Rectangle</td>
<td>/162547629/insideevs/rectangle</td>
<td>m1_banner_place=amp_gallery or version=webmobile (on webmobile)</td>
</tr><tr>
<td>/6122441/EV/fr/Rectangle</td>
<td>/162547629/insideevs/rectangle</td>
<td>m1_page_type=detail-amp</td>
</tr><tr>
<td>Mobile_Leaderboard</td>
<td>/162547629/insideevs/mobile_rectangle</td>
<td>version=webmobile (on webmobile)</td>
</tr>
</table>
### Adverline Adunits Naming For Ferrarichat
#### This part of the previous code example must be modified
``` html=
// Include our wrapper synchronously
<script src="https://cdn.adnext.fr/wrapper/ferrarichat.fr.js"></script>
```
<br>
<table border="0" style="font-size:11px">
<tr>
<td><b style="font-size:16px">Publisher's Adunit</b></td>
<td><b style="font-size:16px">Adverline Adunit Code</b></td>
<td><b style="font-size:16px">Adunit specific Key/Value</b></td>
</tr>
<tr>
<td>/6122441/FC/fc_fr/Super</td>
<td>/162547629/ferrarichat/super</td>
<td>m1_banner_position=top</td>
</tr><tr>
<td>/6122441/FC/fc_fr/Leaderboard</td>
<td>/162547629/ferrarichat/leaderboard</td>
<td>m1_banner_position=top</td>
</tr><tr>
<td>/6122441/FC/fc_fr/Mobile_leaderboard</td>
<td>/162547629/ferrarichat/mobile_leaderboard</td>
<td>m1_banner_position=top</td>
</tr><tr>
<td>/6122441/FC/fc_fr/Super</td>
<td>/162547629/ferrarichat/super</td>
<td>m1_banner_position=middle</td>
</tr><tr>
<td>/6122441/FC/fc_fr/Leaderboard</td>
<td>/162547629/ferrarichat/leaderboard</td>
<td>m1_banner_position=middle</td>
</tr><tr>
<td>/6122441/FC/fc_fr/Rectangle</td>
<td>/162547629/ferrarichat/rectangle</td>
<td>m1_banner_place=rectangle_first</td>
</tr><tr>
<td>/6122441/FC/fc_fr/DMPU</td>
<td>/162547629/ferrarichat/dmpu</td>
<td>m1_banner_place=dmpu_first</td>
</tr><tr>
<td>/6122441/FC/fc_fr/DMPU</td>
<td>/162547629/ferrarichat/dmpu</td>
<td>m1_banner_name=dmpu</td>
</tr><tr>
<td>/6122441/FC/fc_fr/Native</td>
<td>/162547629/ferrarichat/native</td>
<td>m1_native=1 or ms_native=2</td>
</tr><tr>
<td>/6122441/FC/fc_fr/Super</td>
<td>/162547629/ferrarichat/super</td>
<td>m1_banner_position=popup_gallery_top</td>
</tr><tr>
<td>/6122441/FC/fc_fr/Mobile_leaderboard</td>
<td>/162547629/ferrarichat/mobile_leaderboard</td>
<td>m1_banner_position=popup_gallery_top</td>
</tr><tr>
<td>/6122441/FC/fc_fr/DMPU</td>
<td>/162547629/ferrarichat/dmpu</td>
<td>m1_banner_position=popup_gallery_rectangle or version=webmobile (on webmobile)</td>
</tr><tr>
<td></td>
<td>/162547629/ferrarichat/rectangle_mobile</td>
<td>m1_page_type=detail-amp</td>
</tr>
</table>
Sign in with Wallet
Connect another wallet