Working with RTB ad block code
You can enable the additional functions and change certain settings by directly editing the ad code without using the code designer in the interface.
The Ya.Context.AdvManager.render
function is responsible for invoking the ad in the code.
Statistical samples for RTB blocks
You can additionally specify sample identifiers (IDs) and collect separate statistics using samples in the RTB block code. The sample ID is provided in a separate variable:
Variable name | Description | Data type |
---|---|---|
statId | Sample ID | A number between 1 and 1000000000 |
Variable name | Description | Data type |
---|---|---|
statId | Sample ID | A number between 1 and 1000000000 |
Enter the sample ID in the ad code to be placed on the site. For example:
For the block R-A-123456-1
from the example, the sample ID is 34567
. It can also be specified in other blocks. This will allow you to view group statistics for these blocks. By placing the R-A-123456-1
block on other pages, you can specify a different sample ID to view statistics separately for each placement.
Statistical reports that are grouped by sample can be created using the designer.
The callback function that is invoked after ad rendering
The onRender
Callback function allows you to obtain information about whether the ad has been rendered (whether the ad was successfully selected when requested from the RTB system) and which particular ad was shown. The function obtains the data.product
parameter with one of two values:
direct
— Yandex.Direct ads were shown in an RTB ad block.rtb
— A media ad was shown in an RTB ad block.
The onRender
callback function must be added as the last parameter in the Ya.Context.AdvManager.render function. The function can only be used in asynchronous code for invoking the ad.
<div id="rtb-2"></div>
<script type="text/javascript">
(function (w, d, n, s, t) {
w[n] = w[n] || [];
w[n].push(function() {
Ya.Context.AdvManager.render({
blockId: "R-A-12345-1",
renderTo: "rtb-2",
async: true,
onRender: function (data) {
console.log(data.product);
}
});
});
t = d.getElementsByTagName("script")[0];
s = d.createElement("script");
s.type = "text/javascript";
s.src = "//an.yandex.ru/system/context.js";
s.async = true;
t.parentNode.insertBefore(s, t);
})(this, this.document, "yandexContextAsyncCallbacks");
</script>
Function to invoke your ad in the RTB block
- Get the RTB block code in the YAN interface ().
- Place the RTB block code on the site.
- Add your ad code as the last parameter of the Ya.Context.AdvManager.render function.
The ad code for the RTB block can be synchronous or asynchronous. Only asynchronous JavaScript code can be used in the function for calling your ad.
If the auction didn't produce a matching offer, the alternative code is executed, and your own ad is displayed instead of the ad block (not via iFrame). Impressions of your own ads are not counted in the YAN statistics.
There is another way to show your own ads: enter the ad code in the YAN interface. The code snippet for displaying your ad will be generated and added to the RTB block code automatically. This way you can use iFrame to display your own ads and include these impressions in the YAN statistics.
Ad impressions in infinite scroll feeds
To display ads in infinite scroll feeds, you can use the same ad block and just change the pageNumber
parameter and the name of the renderTo
container. The unique blockId
from the code designer remains unchanged.
<div id="rtb-5-1"></div>
<script type="text/javascript">
(function (w, d, n, s, t) {
w[n] = w[n] || [];
w[n].push(function() {
Ya.Context.AdvManager.render({
blockId: "R-A-12345-1",
renderTo: "rtb-5-1",
pageNumber: 1
});
});
t = d.getElementsByTagName("script")[0];
s = d.createElement("script");
s.type = "text/javascript";
s.src = "//an.yandex.ru/system/context.js";
s.async = true;
t.parentNode.insertBefore(s, t);
})(this, this.document, "yandexContextAsyncCallbacks");
</script>
<div id="rtb-5-2"></div>
<script type="text/javascript">
(function (w, d, n, s, t) {
w[n] = w[n] || [];
w[n].push(function() {
Ya.Context.AdvManager.render({
blockId: "R-A-12345-1",
renderTo: "rtb-5-2",
pageNumber: 2
});
});
t = d.getElementsByTagName("script")[0];
s = d.createElement("script");
s.type = "text/javascript";
s.src = "//an.yandex.ru/system/context.js";
s.async = true;
t.parentNode.insertBefore(s, t);
})(this, this.document, "yandexContextAsyncCallbacks");
</script>
Container size for a custom-size ad block
The custom-size block adapts to the size of the container and is suitable for sites with an adaptive layout. Use stylesheets to specify the container size for sites with an adaptive layout.
Add the tag
div
CSS classyandex-adaptive
in the ad code that you obtained in the interface.Example<div id="yandex_direct_R-A-12345-1" class="yandex-adaptive"></div>
Use
media-queries
to configure the container to accept various sizes depending on the screen resolution.Example@media screen and (max-width: 700px) { .yandex-adaptive { width:200px; height:300px; } } @media screen and (min-width: 701px) { .yandex-adaptive { width:336px; height:280px; } }
This means that on screens up to 700 pixels wide, ads will be displayed in a 200×300 block, and on screens with a width of 701 pixels, a 336×280 block will be used.