Обратный вызов после рендеринга DFP
Мне нужно запустить JavaScript после. DFP закончил показ всех объявлений на странице - или, по крайней мере, когда он вызвал collapseEmptyDivs (который скрывает рекламные блоки, которые не содержат позиций).
Кто-нибудь знает, как заставить DFP инициировать обратный вызов после любого из этих событий?
Ответы
Ответ 1
Я взломал функцию googletag debug_log.log и протащил ее через jQuery для запуска событий во многих действиях DFP. Для взлома требуется jQuery.
https://github.com/mcountis/dfp-events
- GPT-google_js_loaded
- GPT-gpt_fetch
- GPT-gpt_fetched
- GPT-page_load_complete
- GPT-queue_start
- GPT-service_add_slot
- GPT-service_add_targeting
- GPT-service_collapse_containers_enable
- GPT-service_create
- GPT-service_single_request_mode_enable
- GPT-slot_create
- GPT-slot_add_targeting
- GPT-slot_fill
- GPT-slot_fetch
- GPT-slot_receiving
- GPT-slot_render_delay
- GPT-slot_rendering
- GPT-slot_rendered
Ответ 2
Теперь API GPT имеет обратный вызов, который запускается после заполнения каждого слота.
Например:
googletag.pubads().addEventListener('slotRenderEnded', function(event) {
console.log('Creative with id: ' + event.creativeId +
' is rendered to slot of size: ' + event.size[0] + 'x' + event.size[1]);
});
См. https://developers.google.com/doubleclick-gpt/reference#googletag.events.SlotRenderEndedEvent
Ответ 3
Загрузите script в часть вашей страницы:
// set global variable if not already set
var googletag = googletag || {};
googletag.cmd = googletag.cmd || [];
// load asynchronously the GPT JavaScript library used by DFP,
// using SSL/HTTPS if necessary
(function() {
var gads = document.createElement('script');
gads.async = true;
gads.type = 'text/javascript';
var useSSL = 'https:' === document.location.protocol;
gads.src = (useSSL ? 'https:' : 'http:') + '//www.googletagservices.com/tag/js/gpt.js';
var node =document.getElementsByTagName('script')[0];
node.parentNode.insertBefore(gads, node);
})();
Инициализировать тег издателя Google со следующим script, предпочтительным также в разделе вашей страницы:
// can be moved as well in the body
// if using async mode, wrap all the javascript into googletag.cmd.push!
googletag.cmd.push(function() {
// set page-level attributes for ad slots that serve AdSense
googletag.pubads().set("adsense_background_color", "FFFFFF");
googletag.pubads().setTargeting("topic","basketball");
// enables Single Request Architecture (SRA)
googletag.pubads().enableSingleRequest();
// Disable initial load, we will use refresh() to fetch ads.
// Calling this function means that display() calls just
// register the slot as ready, but do not fetch ads for it.
googletag.pubads().disableInitialLoad();
// Collapses empty div elements on a page when there is no ad content to display.
googletag.pubads().collapseEmptyDivs();
// Enables all GPT services that have been defined for ad slots on the page.
googletag.enableServices();
});
Регистрировать слоты индивидуально (могут быть сгенерированы с помощью цикла foreach) и визуализировать их. Слушатель событий может быть зарегистрирован также на каждый слот.
Здесь важная часть: убедитесь, что вы обновляете их вместе, чтобы не оказаться в одной и той же рекламе на обоих слотах (если объявление назначается обеим слотам) = > googletag.pubads(). Refresh ([slot1, slot2]]);
// this code can be moved externally to improve performance
googletag.cmd.push(function() {
// define slot1
slot1 = googletag.defineSlot(
"/1234/travel/asia/food",
[728, 90],
"banner1"
)
.addService(googletag.pubads())
.setTargeting(
"interests",
["sports", "music", "movies"]
);
// prerender the slot but don't display it because of disableInitialLoad()
googletag.display("banner1");
// define slot2
slot2 = googletag.defineSlot(
"/1234/travel/asia/food",
[[468, 60], [728, 90], [300, 250]],
"banner2"
)
.addService(googletag.pubads())
.setTargeting("gender", "male")
.setTargeting("age", "20-30");
// prerender the slot but don't display it because of disableInitialLoad()
googletag.display("banner2");
// add event to sign the slot as redered or not
googletag.pubads().addEventListener('slotRenderEnded', function(event) {
if (event.slot === slot1 || event.slot === slot2) {
// do something related to the slot
}
});
// refresh all container ads and show them
// very important to call refresh with an array to avoid
// multiple callback to the registered event
googletag.pubads().refresh([slot1, slot2]);
});
<div id="banner1" style="width:300px; height:250px;"></div>
<div id="banner2" style="width:300px; height:250px;"></div>
После того, как объявление было отображено, активируется обратный вызов.
Для получения дополнительной информации просмотрите этот файл:
https://github.com/davidecantoni/googletag
Ответ 4
Посмотрите расширение jQuery DFP, над которым я работаю... он по-прежнему немного работает, но обеспечивает обратный вызов вы после.
Пример того, как его использовать, находится в этом файле.
Вы увидите, что два обратных вызова доступны... после загрузки каждого объявления и загрузки всех объявлений. Класс также задается в элементе контейнера рекламного блока, это может быть либо display-none (когда объявление не найдено), блок отображения (когда объявление найдено), либо отображение-оригинальное (если объявление не найдено, но контейнер div содержал контент для начала, я использую его для перехода на определенные части сайтов с рекламным контентом, когда это необходимо). Эти классы, конечно, полезны для работы с одним обратным вызовом.
Ответ 5
Я уверен, что DFP не обеспечивает обратный вызов после рендеринга объявления. Для этого я использовал следующий код. Он вызывает функцию обратного вызова после того, как произошло одно из следующих событий:
- Объявление загрузилось, и iframe отобразил
-Не было загружено объявление, а рекламный блок был скрыт командой collapseEmptyDivs()
- Прошло некоторое время (в данном случае 2 секунды), при этом ни одно из них не происходило.
Например, если произошла какая-то сетевая ошибка, связанная с DFP.
adId будет идентификатором вашего рекламного контейнера
предполагает, что вы используете jQuery
function callback() {
//your callback function - do something here
}
function getIframeHtml(iframe) {
if(iframe.contentWindow && iframe.contentWindow.document && iframe.contentWindow.document.body && iframe.contentWindow.document.body.innerHTML) {
return iframe.contentWindow.document.body.innerHTML;
}
return null;
}
var dfpNumChecks = 20;
var dfpCheckCount = 0;
var dfpCheckTimer = 100;
function dfpLoadCheck(adId) {
var nodes = document.getElementById(adId).childNodes;
if(nodes.length && nodes[0].nodeName.toLowerCase() == 'iframe' && getIframeHtml(nodes[0])) {
//the iframe for the ad has rendered
callback();
return;
} else if($('#' + adId).css('display') == 'none' || (dfpCheckCount >= dfpNumChecks)) {
//the ad unit has been hidden by collapseEmptyDivs()
callback();
return;
} else {
dfpCheckCount++;
setTimeout(function() { dfpLoadCheck(adId) }, dfpCheckTimer);
}
}
Ответ 6
Если вам нужно идентифицировать конец визуализации определенного слота (полезно, если вы используете одно и то же объявление для нескольких слотов), вы можете сделать следующее
googleAd = googletag.defineSlot('/xxxxx/web_top_AAAxAAA', [xxx, xxx], 'div-id').addService(googletag.pubads());
googletag.pubads().addEventListener('slotRenderEnded', function(event) {
if( event.slot.W == googleAd.W ){
// your code here
}
});