שליטה ברענון וברענון של מודעות

במאמר 'תחילת העבודה' ובדוגמאות העיקריות לקונספט, אנחנו משתמשים בשיטה display() של ספריית Google Publisher Tag ‏(GPT) כדי לרשום ולהציג מקום מודעה. עם זאת, לפעמים עדיף או אפילו הכרחי להפריד את הפעולות האלה, כדי שליטה מדויקת במועד הטעינה של תוכן המודעה. לדוגמה, כשעובדים עם פלטפורמה לניהול הסכמה או מבקשים תוכן של מודעה כתוצאה מפעולה של משתמש.

במדריך הזה נסביר על המנגנונים ש-GPT מספק כדי לשלוט בחיוב של תוכן המודעות ולאחזר תוכן מודעות חדש על פי דרישה. הקוד המלא לדוגמה הזו מופיע בדף לדוגמה בקשות מבוססות-אירוע.

שליטה בטעינת המודעות

כברירת מחדל, ההתנהגות של השיטה display() היא: לרשום, לבקש ולעבד תוכן מודעה במיקום מודעה. הפורמט האוטומטי ניתן להשבית את הבקשה וההצגה של תוכן מודעה באמצעות PubAdsService.disableInitialLoad().

כשהטעינה הראשונית מושבתת, שיחות אל display() רושמות רק את מיקום המודעה בדף. תוכן המודעה לא ייטען עד שתתבצע פעולה שנייה. כך אפשר לשלוט באופן מדויק בזמן שליחת בקשות להצגת מודעות.

כדי למנוע בקשות לא מכוונות להצגת מודעות, צריך להפעיל את 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");
      });
    </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>

בדוגמה המשופרת הזו, כשמשתמש לוחץ על הלחצן 'הצגת המודעה/רענון המודעה', מתבצעת קריאה ל-method‏ refresh(). הפעולה הזו מפעילה בקשה לאחזר תוכן מודעה חדש ולטעון אותו במקום הזמין הרשום, כך שיחליף את התוכן הקיים.

שימו לב שבדוגמה הקודמת, השיטה refresh() נקראת ללא פרמטרים, וכתוצאה מכך מתבצע רענון של כל שטחי המודעות הרשומים. עם זאת, אפשר גם לרענן מיקומי מודעות ספציפיים על ידי העברת מערך של מיקומי מודעות לשיטה refresh(). רענון של מיקומי מודעות בדף לדוגמה.

שיטות מומלצות

כשעובדים עם refresh(), יש כמה שיטות מומלצות שכדאי לפעול לפיהן.

  1. אין לרענן את הדף מהר מדי.

    רענון מהיר מדי של מיקומי המודעות עלול לגרום לכך שהבקשות להצגת מודעות ינוטרלו. כדי למנוע זאת, מומלץ לא לרענן את שטחי הפרסום בתדירות גבוהה יותר מפעם אחת בכל 30 שניות.

  2. לא להתקשר אל clear() ללא צורך

    כאשר מרעננים משבצת מודעה, אין להתקשר קודם PubAdsService.clear(). אין כאן צורך, מאחר refresh() מחליף את התוכן של המשבצת שצוינה, ללא קשר ל- אם תוכן מודעה כלשהו נטען בעבר. קריאה ל-clear() מיד לפני קריאה ל-refresh() רק תגדיל את משך הזמן שבו משבצת ריקה תהיה גלויה למשתמש.

  3. רענון רק של משבצות מודעות שגלויות לצופים

    שימוש ב-refresh() להחלפת התוכן של מיקומי מודעות שלא ניתנים לצפייה אף פעם יכול להפחית באופן משמעותי את שיעור ActiveView. ניתן להשתמש ב-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();
});