Table of Contents
- Introduction
- Overview
- Ad Integration
- Ad Placements in the
<body>- Example - Creative Sizes Reference
- QA and Testing
- Special Reports - Lazy Loading
This document describes the necessary steps for integrating online advertisements on desktop and mobile websites for Axel Springer.
The delivery of ads utilizes a "One Call" function, which have to be included in the <head> part of the websites. This will receive the booked campaigns and will let them in the background for lately rendering. The Ad Placements are <div>'s which have to be placed in the wished position for the ad. All Advertisements can be managed via Xandr.
In the following you will find an overview of the necessary components which must be implemented to deliver and display the advertising media.
Elements in the <head> of the website:
<script type="text/javascript">
adSSetup = {view: "[View]", // has to fit the design of the page, please use m for mobile and d for desktop
2. Switch for the 3th party scripts. We strictly recommend to set it as "false" only on pages for directsales campaign only the max out the revenue
partners: true,
Please make sure that you only include placements you will add an adslot (div#adPlacementID) for the url the user has called Also please ensure you add the elements mainly in order they will appear in the website, because the adserver will fill the first elements of each size with the must valueable campaigns.
adPlacements: ["superbanner","sky","billboard","mrec","mrec_btf","mrec_btf_2","mrec_btf_3","inpage"],
adPlacements: ["banner","mrec","mrec_btf","mrec_btf_2","mrec_btf_3","inpage"],
For Desktop:
- superbanner
- sky
- billboard
- mrec
- inpage
- billboard_btf
- mrec_btf
- sky_btf
For Mobile:
- banner
- mrec
- inpage
- mrec_btf
- banner_sticky
_You can repeat the btf placements as much as you want. Please use the following schema:
Example for 3 Medium Rectangle btf
- mrec_btf
- mrec_btf_2
- mrec_btf_3
Please add the size 9x9 to every placement cleared for programmatic.
adSlotSizes: {
"superbanner": [{
"minWidth": 1,
"sizes": [[728,90],[728,600],[1000,600]]
}],
"sky": [{
"minWidth": 1,
"sizes": [[160,600],[120,600],[300,600],[500,1000],[1000,1000]]
}],
"billboard": [{
"minWidth": 1,
"sizes": [[800,250]]
},{
"minWidth": 969,
"sizes": [[970,250],[800,250]]
}],
"mrec": [{
"minWidth": 1,
"sizes": [[300,250],[300,600]]
}],
"mrec_btf": [{
"minWidth": 1,
"sizes": [[300,250],[300,600]]
}],
"mrec_btf_2": [{
"minWidth": 1,
"sizes": [[300,250],[300,600]]
}],
"mrec_btf_3": [{
"minWidth": 1,
"sizes": [[300,250],[300,600]]
}],
"inpage": [{
"minWidth": 1,
"sizes": [[1,1],[640,360],[1000,300]]
}],
},
adSlotSizes: {
"banner": [{
"minWidth": 1,
"sizes": [[320,50],[320,75],[320,80]]
}],
"mrec": [{
"minWidth": 1,
"sizes": [[300,250],[320,50],[320,75],[320,160],[300,300]]
}],
"mrec_btf": [{
"minWidth": 1,
"sizes": [[300,250],[320,50],[320,75],[320,160],[300,300]]
}],
"mrec_btf_2": [{
"minWidth": 1,
"sizes": [[300,250],[320,50],[320,75],[320,160],[300,300]]
}],
"mrec_btf_3": [{
"minWidth": 1,
"sizes": [[300,250],[320,50],[320,75],[320,160],[300,300]]
}],
"inpage": [{
"minWidth": 1,
"sizes": [[1,1],[640,360],[1000,300]]
}],
}
}
Ad Sizes for every placement:
| Placement | Size 1 | Size 2 | Size 3 | Size 4 | Size 5 |
|---|---|---|---|---|---|
| superbanner | [728,90] |
[728,600] |
[1000,600] |
||
| sky | [160,600] |
[120,600] |
[300,600] |
[500,1000] |
[1000,1000] |
| billboard | [970,250] |
[800,250] |
|||
| mrec | [300,250] |
[300,600] |
|||
| inpage | [1,1] |
[640,360] |
[1000,300] |
| Placement | Size 1 | Size 2 | Size 3 | Size 4 | Size 5 | Size 6 |
|---|---|---|---|---|---|---|
| banner | [320,50] |
[320,75] |
[320,80] |
|||
| mrec | [300,250] |
[320,50] |
[320,75] |
[320,80] |
[320,160] |
[300,300] |
| inpage | [1,1] |
[640,360] |
[1000,300] |
placeholder: {
disablePlaceholders: false, // optional, set to true to disable placeholder logic from adlib
default: { // define your standards either defaults will be used
"border-color": "#EEEDE8",
"background-color": "#F9F9F7",
"admarkPosition": "bottom right", // options: "hidden", "top/bottom", "left/center/right"
"color": "#BCBCBC",
"font-size": "12px",
"font-family": "Tahoma"
},
mrec: { // define default overides for specific adslot
"bgColor": "#FCBFFF"
}
}
colorBg: true, // enable/disable coloring of the page-background
bgClick: true, // enable/disable click on page-background
hasVideoPlayer: true, // enable/disable partnerscripts like headerbiding vor video
isArticle: true, // it shows us if the page is an article
pageName: "demo_story", // channel/article name from CMS, may not contain slashes (/)
target: "value1;value2;value3;key1=value1,value2;key2=value1,value2;",
iabTax: "IAB2,IAB2-1,1,32"
}
If you will be administrated by MediaImpact we recommend the following schema for pageName:
- Home Site --> "home_index"
- Channel, e.g. sport --> "sport_index"
- Sub-Channel e.g. soccer --> "sport.soccer_index"
- Article e.g. soccer article --> "sport.soccer_story"
- you can use stand alone keywords with semicolon
;separately - key/values are also supported.
key=value1,value2; - please ensure to end the line with a semicolon
- with iabTax you can classify your content - have a look into this IAB standard for more info
</script>
<script type="text/javascript" src="https://www.asadcdn.com/adlib/pages/mywebsite.js"></script>
This js contains the whole Ad Library. Every website will get its own js from Axel Springer.
</head>
Ad Placements in the <body> of the website:
<div id="${adPlacement}"></div>
This div has to be wrapped in an own container, has to be free of Styles/CSS and the div id must be the name of the placement. See from line 24 of this document.
Superbanner
<div id="superbannerWrapper" class="container">
<div id="superbanner"></div>
</div>
<div id="superbanner"></div>
This placement should be positioned at the top of the web page. Wallpapers and fireplaces are also delivered via this placement. These sizes must be used.
superbanner | [728,90] | [728,600] | [1000,600]
<div id="sky"></div>
This placement is to be positioned on the left side of the website content. Sitebars, dynamic sitebars, and double-dinamic sitebars are also delivered via this placement. These sizes must be used.
sky | [160,600] | [120,600] | [300,600] | [500,1000] | [1000,1000]
<div id="billboard"></div>
This placement is to be placed directly under the navigation or under the first teaser of the website. These sizes must be used.
billboard | [970,250] | [800,250]
<div id="mrec"></div>
We recommend to place the first Mrec above the fold (ATF). These sizes must be used.
mrec | [300,250] | [300,600]
<div id="inpage"></div>
Interstitials, Understitials, and InText-Outstream Advertising Materials are delivered through the inpage Placement. This placement is to be placed in the position requested by the publisher for InText- Outstream ads. These sizes must be used.
inpage | [1,1] | [640,360] | [1000,300]
<div id="banner"></div>
This placement should be positioned at the top of the web page. These sizes must be used.
banner | [320,50] | [320,75] | [320,80]
<div id="mrec"></div>
We recommend to place the first Mrec above the fold (ATF). These sizes must be used.
mrec | [300,250] | [320,50] | [320,75] | [320,80] | [320,160] | [300,300]
<div id="inpage"></div>
Interstitials, Understitials, and InText-Outstream Advertising Materials are delivered through the inpage Placement. This placement is to be placed in the position requested by the publisher for InText- Outstream ads. This sizes must be used.
inpage | [1,1] | [640,360] | [1000,300]
<div id="mrec"></div>
This placement can be placed multiple times on a page. We stron recommend to place one mrec_btf after 3 blocks of text. Please use the following schema
- mrec_btf
- mrec_btf_2
- mrec_btf_3
mrec | [300,250] | [320,50] | [320,75] | [320,80] | [320,160] | [300,300]
Each Size belongs to a certain creative. For standard creatives we use the IAB standards.
| Size | Creative | IAB | Preview |
|---|---|---|---|
| 728,90 | Superbanner/Leaderboard | YES |  |
| 728,600 | Wallpaper | NO |  |
| 1000,600 | Fireplace | NO |  |
| 120,600 / 160,600 | Skyscraper/Wide Skyscraper | YES |  |
| 500,1000 | Sitebar / Dynamic Sitebar | NO |  |
| 1000,1000 | Double Dynamic Sitebar | NO |  |
| 970,250 / 800,250 | Billboard | YES |  |
| 320,50 | Mobile Banner 6:1 | YES |  |
| 320,75 / 320,160 | Mobile Banner 4:1, 2:1 | NO |  |
| 300,300 | Premium Content Ad / 1:1 | NO |  |
| 1,1 | Interstitial / Layer | NO |  |
| 640,360 | InText Outstream | NO |  |
| 1000,300 | Understitial | NO |  |
Xandr blocks clients or ip-address that make too many ad requests on a determined placement or in a too short time interval. For it is strongly recommended that before you start testing, to change the browser headers.
https://chrome.google.com/webstore/detail/modheader/idgpnmonknjnojddfkpgkljpfnnfcklj?hl=de
After installing the plugin please insert the following Request Header: 'X-Is-Test:1'
In order to get test advertising please open the following URL at first, it will turn on the test ads for 30 days. Please be sure that your browsers accepts 3th party cookies.
https://adtechnology.axelspringer.com/testads.html
If your website hast special placement f.e. Teaser, multilinks, etc., please contact [email protected] to get the test-instructions.
The "btf" placements in the Browser are loaded with lazy loading. Those ads will be rendered only if the placement 100px under the viewport
