Dalam contoh konsep memulai dan dasar kami, Tag Google Publisher
Metode display()
library (GPT) digunakan
untuk mendaftar dan menampilkan slot iklan. Namun, ada kalanya
lebih disukai atau bahkan diperlukan untuk memisahkan
tindakan ini, untuk lebih
dapat mengontrol secara akurat
kapan konten iklan dimuat. Misalnya, saat bekerja dengan
platform pengelolaan izin atau meminta konten iklan sebagai hasil dari pengguna
tindakan.
Dalam panduan ini, kita akan mempelajari mekanisme yang disediakan GPT untuk mengontrol pemuatan konten iklan dan mengambil konten iklan baru sesuai permintaan. Kode lengkap untuk contoh ini dapat ditemukan di permintaan berbasis peristiwa contoh halaman.
Mengontrol pemuatan iklan
Secara default, perilaku metode display()
adalah
mendaftar, meminta, dan menampilkan konten iklan ke dalam slot iklan. Opsi otomatis
permintaan dan penyajian konten iklan dapat dinonaktifkan melalui
Metode PubAdsService.disableInitialLoad()
.
Dengan pemuatan awal dinonaktifkan, panggilan ke display()
hanya akan mendaftarkan slot iklan.
Tidak ada konten iklan yang akan dimuat hingga tindakan kedua dilakukan. Hal ini memungkinkan Anda untuk
mengontrol secara akurat kapan permintaan iklan dibuat.
Untuk menghindari pembuatan permintaan iklan yang tidak disengaja, disableInitialLoad()
harus dipanggil
sebelum mengaktifkan layanan dan sebelum memanggil 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>
Dalam contoh ini, pemuatan awal dinonaktifkan untuk memastikan tidak ada permintaan iklan yang dibuat
dan tidak ada konten iklan yang dirender saat display()
dipanggil. Slot siap untuk
menyetujui dan menampilkan iklan, namun permintaan iklan tidak akan dibuat hingga slot
diperbarui.
Muat ulang
Metode PubAdsService.refresh()
digunakan untuk mengisi
atau slot dengan konten iklan baru. Metode ini dapat digunakan
pada slot yang memiliki
belum memuat konten apa pun (karena disableInitialLoad()
), atau untuk mengganti
konten slot yang telah diisi. Namun, hanya slot yang telah
yang didaftarkan dengan memanggil display()
memenuhi syarat untuk diperbarui.
<!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>
Dalam contoh yang diubah ini, saat pengguna mengklik "Tampilkan/Muat Ulang Iklan" tombol,
Metode refresh()
dipanggil. Tindakan ini memicu permintaan untuk mengambil konten iklan baru
dan memuatnya ke dalam slot yang terdaftar, menimpa konten yang sudah ada sebelumnya.
Perlu diketahui bahwa dalam contoh di atas, metode refresh()
dipanggil tanpa
parameter, yang memiliki efek memuat ulang semua slot iklan yang terdaftar.
Namun, Anda juga dapat memperbarui slot iklan tertentu dengan meneruskan array
slot ke metode refresh()
. Lihat Memuat ulang slot iklan
untuk contohnya.
Praktik terbaik
Saat bekerja dengan refresh()
, ada beberapa praktik terbaik yang harus
dipatuhi.
Jangan memuat ulang terlalu cepat.
Memuat ulang slot iklan terlalu cepat dapat menyebabkan permintaan iklan Anda terhambat. Untuk mencegah hal ini, hindari memuat ulang slot lebih dari sekali setiap 30 detik.
Jangan memanggil
clear()
jika tidak perluSaat memuat ulang slot iklan, jangan panggil
PubAdsService.clear()
terlebih dahulu. Ini tidak perlu, karenarefresh()
menggantikan konten slot yang ditentukan, terlepas dari apakah ada konten iklan yang sebelumnya dimuat. Segera meneleponclear()
sebelum memanggilrefresh()
hanya akan menambah jumlah waktu slot kosong dapat dilihat oleh pengguna.Hanya memuat ulang slot iklan yang terlihat
Menggunakan
refresh()
untuk mengganti konten slot iklan yang tidak pernah terlihat secara signifikan dapat menurunkan rasio ActiveView Anda. Tujuan ImpressionViewableEvent dapat digunakan untuk menentukan kapan slot iklan menjadi terlihat, seperti dalam contoh di bawah.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(); });