ในตัวอย่างแนวคิดการเริ่มต้นใช้งานและพื้นฐาน แท็กผู้เผยแพร่โฆษณาผ่าน Google
ระบบใช้เมธอด display()
ของไลบรารี (GPT)
เพื่อลงทะเบียนและแสดงช่องโฆษณา แต่ก็มีบางครั้งที่
มีประสิทธิภาพมากกว่า หรือแม้กระทั่งจำเป็นต่อการแยกการกระทำเหล่านี้ เพื่อเพิ่ม
ควบคุมได้อย่างแม่นยำว่าระบบจะโหลดเนื้อหาโฆษณาเมื่อใด เช่น เมื่อทำงานกับ
แพลตฟอร์มการจัดการความยินยอม (CMP) หรือการส่งคำขอเนื้อหาโฆษณาจากผู้ใช้
การดำเนินการ
ในคู่มือนี้เราจะสำรวจกลไกที่ GPT มีให้เพื่อ ควบคุมการโหลดเนื้อหาโฆษณาและดึงเนื้อหาโฆษณาใหม่ตามคำขอ รหัสแบบเต็ม สำหรับตัวอย่างนี้จะอยู่ในคำขอตามเหตุการณ์ หน้าตัวอย่าง
ควบคุมการโหลดโฆษณา
โดยค่าเริ่มต้น ลักษณะการทำงานของเมธอด display()
คือ
ลงทะเบียน ส่งคำขอ และแสดงเนื้อหาโฆษณาในช่องโฆษณา อินเทอร์เฟซผู้ใช้
สามารถปิดใช้การส่งคำขอและการแสดงผลเนื้อหาโฆษณาได้ผ่าน
PubAdsService.disableInitialLoad()
เมื่อปิดใช้การโหลดเริ่มต้น การเรียก display()
จะลงทะเบียนเฉพาะช่องโฆษณาเท่านั้น
จะไม่มีการโหลดเนื้อหาโฆษณาจนกว่าจะมีการดำเนินการครั้งที่ 2 วิธีนี้ช่วยให้คุณทำสิ่งต่อไปนี้ได้
ควบคุมช่วงเวลาที่สร้างคำขอโฆษณาได้อย่างแม่นยำ
ต้องเรียกใช้ disableInitialLoad()
เพื่อหลีกเลี่ยงการสร้างคำขอโฆษณาโดยไม่ได้ตั้งใจ
ก่อนเปิดใช้บริการและก่อนเรียก display()
<!doctype html> <html> <head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1" /> <meta name="description" content="Request GPT ads based on events." /> <title>Event-based ad requests</title> <script async src="https://securepubads.g.doubleclick.net/tag/js/gpt.js" crossorigin="anonymous" ></script> <script> window.googletag = window.googletag || { cmd: [] }; googletag.cmd.push(() => { // Define the ad slot. googletag .defineSlot("/6355419/Travel", [728, 90], "div-for-slot") .setTargeting("test", "event") .addService(googletag.pubads()); // Disable initial load. // This prevents GPT from automatically fetching ads when display is called. googletag.pubads().disableInitialLoad(); googletag.enableServices(); }); </script> <style></style> </head> <body> <div id="div-for-slot" style="width: 300px; height: 250px"></div> <script> googletag.cmd.push(() => { // Register the ad slot. // An ad will not be fetched until refresh is called. googletag.display("div-for-slot"); // Register click event handler. document.getElementById("showAdButton").addEventListener("click", () => { googletag.cmd.push(() => { googletag.pubads().refresh(); }); }); }); </script> </body> </html>
ในตัวอย่างนี้ การโหลดเริ่มต้นจะถูกปิดใช้งานเพื่อให้แน่ใจว่าไม่มีการสร้างคำขอโฆษณา
และไม่มีการแสดงผลเนื้อหาโฆษณาเมื่อเรียกใช้ display()
ช่วงเวลาพร้อมที่จะ
ยอมรับและแสดงโฆษณา แต่คำขอโฆษณาจะไม่เกิดขึ้นจนกว่าช่องโฆษณาจะ
รีเฟรชแล้ว
รีเฟรช
เมธอด PubAdsService.refresh()
ใช้ในการป้อนข้อมูล
หรือช่องโฆษณาที่มีเนื้อหาโฆษณาใหม่ เมธอดนี้สามารถใช้บนช่องโฆษณาที่มี
ยังไม่ได้โหลดเนื้อหาใดๆ (เนื่องจาก disableInitialLoad()
) หรือแทนที่
เนื้อหาของช่องโฆษณาที่มีอยู่แล้ว อย่างไรก็ตาม เฉพาะสล็อตที่
ที่ลงทะเบียนโดยการโทร display()
จะมีสิทธิ์รีเฟรช
<!doctype html> <html> <head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1" /> <meta name="description" content="Request GPT ads based on events." /> <title>Event-based ad requests</title> <script async src="https://securepubads.g.doubleclick.net/tag/js/gpt.js" crossorigin="anonymous" ></script> <script> window.googletag = window.googletag || { cmd: [] }; googletag.cmd.push(() => { // Define the ad slot. googletag .defineSlot("/6355419/Travel", [728, 90], "div-for-slot") .setTargeting("test", "event") .addService(googletag.pubads()); // Disable initial load. // This prevents GPT from automatically fetching ads when display is called. googletag.pubads().disableInitialLoad(); googletag.enableServices(); }); </script> <style></style> </head> <body> <div id="div-for-slot" style="width: 300px; height: 250px"></div> <button id="showAdButton">Show/Refresh Ad</button> <script> googletag.cmd.push(() => { // Register the ad slot. // An ad will not be fetched until refresh is called. googletag.display("div-for-slot"); // Register click event handler. document.getElementById("showAdButton").addEventListener("click", () => { googletag.cmd.push(() => { googletag.pubads().refresh(); }); }); }); </script> </body> </html>
ในตัวอย่างที่แก้ไขนี้ เมื่อผู้ใช้คลิก "แสดง/รีเฟรชโฆษณา"
มีการเรียกเมธอด refresh()
ซึ่งจะทริกเกอร์คำขอดึงเนื้อหาโฆษณาใหม่
และโหลดลงในช่องที่ลงทะเบียน โดยเขียนทับเนื้อหาที่มีอยู่แล้ว
โปรดทราบว่าในตัวอย่างด้านบน มีการเรียกเมธอด refresh()
โดยไม่มีค่า
พารามิเตอร์ ซึ่งมีผลของการรีเฟรชช่องโฆษณาที่ลงทะเบียนไว้ทั้งหมด
อย่างไรก็ตาม คุณยังสามารถรีเฟรชช่องโฆษณาที่ต้องการได้โดยส่งอาร์เรย์
ลงในเมธอด refresh()
ดูส่วนรีเฟรชช่องโฆษณา
เป็นตัวอย่าง
แนวทางปฏิบัติแนะนำ
เมื่อทำงานร่วมกับ refresh()
แนวทางปฏิบัติแนะนำที่ควรจะเป็น
ปฏิบัติตาม
อย่ารีเฟรชเร็วเกินไป
การรีเฟรชช่องโฆษณาเร็วเกินไปอาจทำให้คำขอโฆษณาถูกควบคุม เพื่อป้องกันปัญหานี้ ให้หลีกเลี่ยงการรีเฟรชสล็อตบ่อยกว่า 1 ครั้งในทุกๆ 30 วินาที
อย่าโทรหา
clear()
โดยไม่จำเป็นเมื่อรีเฟรชช่องโฆษณา ไม่ต้องเรียก
PubAdsService.clear()
ก่อน ขั้นตอนนี้ไม่จำเป็น เนื่องจากrefresh()
แทนที่เนื้อหาของช่องที่ระบุโดยไม่คำนึงถึง เคยโหลดเนื้อหาโฆษณามาก่อนไหม กำลังโทรหาclear()
ทันที ก่อนที่จะเรียกrefresh()
จะเพิ่มระยะเวลาที่ช่องว่างในการเรียก แสดงต่อผู้ใช้รีเฟรชเฉพาะช่องโฆษณาที่มองเห็นได้
ใช้
refresh()
เพื่อแทนที่เนื้อหาของช่องโฆษณาที่ไม่เคยแสดง อาจลดอัตรามุมมองแอ็กทีฟลงอย่างมาก ImpressionViewableEvent เพื่อ กำหนดเวลาที่ช่องโฆษณาจะมองเห็นได้ดังในตัวอย่างด้านล่างgoogletag.cmd.push(function() { var REFRESH_KEY = 'refresh'; var REFRESH_VALUE = 'true'; googletag.defineSlot('/6355419/Travel',[728, 90], 'div-for-slot') .setTargeting(REFRESH_KEY, REFRESH_VALUE) .setTargeting('test', 'event') .addService(googletag.pubads()); // Number of seconds to wait after the slot becomes viewable. var SECONDS_TO_WAIT_AFTER_VIEWABILITY = 60; googletag.pubads().addEventListener('impressionViewable', function(event) { var slot = event.slot; if (slot.getTargeting(REFRESH_KEY).indexOf(REFRESH_VALUE) > -1) { setTimeout(function() { googletag.pubads().refresh([slot]); }, SECONDS_TO_WAIT_AFTER_VIEWABILITY * 1000); } }); googletag.enableServices(); });