2016-07-16 5 views
0

Google DFP를 사용하여 무한 스크롤에서 ajax를 통해로드 된 모든 페이지에 광고를 표시하려고합니다. 각 페이지마다 4 개의 슬롯이 있습니다. 일반 Google DFP 코드를 따르겠습니다. 내 경우에는 :무한 스크롤 페이지의 Google DFP 태그

<script type='text/javascript'> 
var googletag = googletag || {}; 
googletag.cmd = googletag.cmd || []; 
(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); 
})(); 
</script> 

<script type='text/javascript'> 
googletag.cmd.push(function() { 
googletag.defineSlot('/XXXXXXX/ROS_DHTML', [600, 600], 'div-gpt-ad-5').addService(googletag.pubads()); 
googletag.defineSlot('/XXXXXXX/ROS_Horizontal', [960, 250], 'div-gpt-ad-6').addService(googletag.pubads()); 
googletag.defineSlot('/XXXXXXX/ROS_Interstitial', [1920, 1080], 'div-gpt-ad-7').addService(googletag.pubads()); 
googletag.defineSlot('/XXXXXXX/ROS_Txt', [[300, 250], [300, 600]], 'div-gpt-ad-8').addService(googletag.pubads()); 
googletag.pubads().collapseEmptyDivs(); 
googletag.enableServices(); 
}); 
</script> 

다음으로 광고를 다시 호출하십시오.

<div id='div-gpt-ad-8'> 
<script type='text/javascript'> 
googletag.cmd.push(function() { googletag.display('div-gpt-ad-8'); }); 
</script> 
</div> 

내 무한 스크롤 스크립트 (워드 프레스에 대한 Ajax Load More 플러그인은) 나에게 모든 성공적인 쿼리 후 전달되는 콜백 함수를 제공합니다. 예를 들어 AddThis, Facebook 및 Twitter 버튼 코드에이 코드를 사용합니다.

$(function() { 
$.fn.almComplete = function(alm){ 
console.log("Ajax Load More Complete!"); 
}; 
})(jQuery); 

어떻게하면 DFP와이 콜백 함수가 함께 작동하게 할 수 있습니까? 나는 Advanced Google Publisher Tag에 대해 알고 있지만, 나는 세계에서 가장 잘 알고있는 코드가 아니며, 나는 (내가 많은 슬롯을 사용했기 때문에) 그것을 나의 필요에 맞출 수 없었다. 그래서, 이것이 더 쉬운 방법이라고 생각했습니다. ...

답변

2

각 슬롯에 대해 새로운 ID (div-gpt-ad-randomNumber)를 사용하여 문제를 해결하는 열쇠를 찾은 다음 해당 id를 오른쪽 요소에 사용합니다. 당신은 배너를 추가하고 싶습니다.

function getRandomId() { 
    return "ad-" + Date.now(); 
} 

var ad1 = getRandomId(), 
    ad2 = getRandomId(), 
    ad3 = getRandomId(); 

googletag.cmd.push(function() { 
    googletag.defineSlot('/XXXXXXX/ROS_DHTML', [600, 600], ad1).addService(googletag.pubads()); 
    googletag.defineSlot('/XXXXXXX/ROS_Horizontal', [960, 250], ad2).addService(googletag.pubads()); 
    googletag.defineSlot('/XXXXXXX/ROS_Interstitial', [1920, 1080], getRandomId()).addService(googletag.pubads()); 
    googletag.defineSlot('/XXXXXXX/ROS_Txt', [[300, 250], [300, 600]], ad3).addService(googletag.pubads()); 
    googletag.pubads().collapseEmptyDivs(); 
    googletag.enableServices(); 
}); 

//You can do a cleaner version with a loop but I think this example it's better to understand the idea 

var adContainer = document.createElement("div"); 
div.id = ad1; 
document.body.appendChild(adContainer); // Append it where you need 
googletag.cmd.push(function() { googletag.display(ad1);}); 

//Repeat it for ad2 and ad3 

을 충분히 알려 아니에요 경우 : 당신이 새로운 임의의 아이디의 다시 당신이 필요로하는 슬롯을 정의해야 스크롤하는 동안 각각의 '일반'부하에 대한

나는 실제 예제로 일하는 바이올린으로 포스트를 편집 할 것이다.

+0

두 번째 부분을 얻지 못했습니다. 그거 할 수있어? :) – borbs

+0

예를 들어 바이올린입니다. [FiddleJS] (https://jsfiddle.net/oscardom/cog46j82/4/) 클릭 할 때마다 새 배너를로드하는 간단한 예제입니다. 코드에 대한 설명이 필요한 경우 알려주십시오. P.S. : 바이올린에서 인라인 JS를 사용하여 죄송합니다. JS 파트에 모든 것을 넣으려고했지만 작동하지 않았습니다. 다행히도 여전히 유용합니다. – OscarDOM