Trong các ví dụ về khái niệm cơ bản và bắt đầu của chúng tôi, Thẻ nhà xuất bản của Google
Phương thức display()
của thư viện (GPT) được sử dụng
để đăng ký và hiển thị vùng quảng cáo. Tuy nhiên, đôi khi bạn nên hoặc thậm chí cần phải tách biệt các hành động này để kiểm soát chính xác hơn thời điểm tải nội dung quảng cáo. Ví dụ: khi làm việc với một nền tảng quản lý sự đồng ý hoặc yêu cầu nội dung quảng cáo do một hành động của người dùng.
Trong hướng dẫn này, chúng ta sẽ khám phá các cơ chế do GPT cung cấp để kiểm soát việc tải nội dung quảng cáo và tìm nạp nội dung quảng cáo mới theo yêu cầu. Bạn có thể xem mã đầy đủ cho ví dụ này trên trang mẫu yêu cầu dựa trên sự kiện.
Kiểm soát việc tải quảng cáo
Theo mặc định, hành vi của phương thức display()
là đăng ký, yêu cầu và hiển thị nội dung quảng cáo vào một vị trí quảng cáo. Bạn có thể tắt tính năng tự động yêu cầu và hiển thị nội dung quảng cáo bằng cách sử dụng phương thức PubAdsService.disableInitialLoad()
.
Khi tắt tính năng tải ban đầu, các lệnh gọi đến display()
sẽ chỉ đăng ký vùng quảng cáo.
Nội dung quảng cáo sẽ không được tải cho đến khi thực hiện hành động thứ hai. Điều này cho phép bạn kiểm soát chính xác thời điểm thực hiện yêu cầu quảng cáo.
Để tránh tạo các yêu cầu quảng cáo ngoài ý muốn, bạn phải gọi disableInitialLoad()
trước khi bật dịch vụ và trước khi gọi 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"); }); </script> </body> </html>
Trong ví dụ này, tải ban đầu bị vô hiệu hoá nhằm đảm bảo không có yêu cầu quảng cáo nào được thực hiện
và không có nội dung quảng cáo nào được hiển thị khi display()
được gọi. Vị trí này đã sẵn sàng để chấp nhận và hiển thị quảng cáo, nhưng yêu cầu quảng cáo sẽ không được thực hiện cho đến khi vị trí này được làm mới.
Làm mới
Phương thức PubAdsService.refresh()
được dùng để điền vào một
vùng hoặc vùng có nội dung quảng cáo mới. Phương pháp này có thể được sử dụng trên các vị trí có
chưa tải bất kỳ nội dung nào (do disableInitialLoad()
) hoặc để thay thế
nội dung của vùng đã được điền sẵn. Tuy nhiên, chỉ các vị trí
đã đăng ký bằng cách gọi display()
thì mới đủ điều kiện để được làm mới.
<!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>
Trong ví dụ đã sửa đổi này, khi người dùng nhấp vào nút "Hiện/Làm mới quảng cáo", phương thức refresh()
sẽ được gọi. Thao tác này sẽ kích hoạt một yêu cầu tìm nạp nội dung quảng cáo mới và tải nội dung đó vào vị trí đã đăng ký, ghi đè mọi nội dung hiện có.
Xin lưu ý rằng trong ví dụ trước, phương thức refresh()
được gọi mà không có thông số nào. Điều này sẽ làm mới tất cả vị trí quảng cáo đã đăng ký.
Tuy nhiên, bạn cũng có thể làm mới các vùng quảng cáo cụ thể bằng cách truyền một mảng
vị trí cho phương thức refresh()
. Xem phần Làm mới vùng quảng cáo
cho ví dụ về điều này.
Các phương pháp hay nhất
Khi làm việc với refresh()
, bạn nên tuân thủ một số phương pháp hay nhất.
Đừng làm mới quá nhanh.
Việc làm mới vùng quảng cáo quá nhanh có thể khiến các yêu cầu quảng cáo của bạn bị điều tiết. Để ngăn chặn điều này, hãy tránh làm mới vùng thường xuyên hơn 30 lần một lần giây.
Không gọi
clear()
khi không cần thiếtKhi làm mới một vị trí quảng cáo, đừng gọi
PubAdsService.clear()
trước. Việc này là không cần thiết vìrefresh()
sẽ thay thế nội dung của vị trí đã chỉ định, bất kể trước đó có nội dung quảng cáo nào được tải hay không. Gọi choclear()
ngay trước khi gọirefresh()
sẽ chỉ tăng khoảng thời gian cho một vùng trống hiển thị cho người dùng.Chỉ làm mới các vị trí quảng cáo có thể xem
Việc sử dụng
refresh()
để thay thế nội dung của các vị trí quảng cáo không bao giờ xem được có thể làm giảm đáng kể tỷ lệ ActiveView. Bạn có thể sử dụng ImpressionViewableEvent để xác định thời điểm một vị trí quảng cáo trở thành vị trí có thể xem, như trong ví dụ sau: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(); });