Kontroluj ładowanie i odświeżanie reklam

Na początek zapoznaj się z podstawowymi przykładami koncepcji. Metoda display() biblioteki tagów wydawcy Google (GPT) służy do rejestrowania i wyświetlania boksu reklamowego. Zdarza się jednak, że rozdzielenie tych działań może być preferowane lub nawet konieczne, aby precyzyjniej kontrolować ładowanie treści reklamy. Przykładem może być współpraca z platformą do zarządzania zgodą użytkowników lub wysyłanie żądań reklamy w wyniku działania użytkownika.

W tym przewodniku przeanalizujemy mechanizmy dostarczane przez GPT, by kontrolować wczytywanie treści reklam i pobierać nowe treści na żądanie. Pełny kod dla tego przykładu można znaleźć na przykładowej stronie żądań opartych na zdarzeniach.

Kontroluj ładowanie reklam

Domyślnie metoda display() polega na rejestrowaniu i renderowaniu treści reklamy w boksie oraz wysyłaniu do nich żądań. Automatyczne żądania i renderowanie treści reklamy można wyłączyć za pomocą metody PubAdsService.disableInitialLoad().

Przy wyłączonym początkowym ładowaniu połączenie z display() będzie rejestrowane tylko w boksie. Treść reklamy nie zostanie wczytana, dopóki nie zostanie wykonane drugie działanie. Dzięki temu możesz dokładnie kontrolować czas wysyłania żądań reklamy.

Aby uniknąć niezamierzonych żądań reklamy, przed włączeniem usługi i wywołaniem display() musisz wywołać metodę disableInitialLoad(). 

<!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"></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>

W tym przykładzie ładowanie wstępne jest wyłączone, co oznacza, że po wywołaniu tagu display() nie jest wysyłane żadne żądanie reklamy, a żadna treść reklamy nie jest renderowana. Boks jest gotowy do wyświetlenia i wyświetlania reklam, ale żądanie żądania nie zostanie wysłane, dopóki boks nie zostanie odświeżony.

Odśwież

Metoda PubAdsService.refresh() służy do wypełniania boksu reklamowego nowymi treściami. Tej metody można używać w przypadku przedziałów, w których jeszcze nie ładowane są jakiekolwiek treści (ze względu na disableInitialLoad()) lub do zastępowania zawartości już wypełnionych boksów. Jednak odświeżać można tylko przedziały zarejestrowane przez funkcję 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"></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>

W tym zmodyfikowanym przykładzie, gdy użytkownik kliknie przycisk „Wyświetl/Odśwież reklamę”, wywołana będzie metoda refresh(). Spowoduje to wysłanie prośby o pobranie nowych treści reklamy i wczytanie ich w zarejestrowanym boksie, zastępując wszystkie istniejące treści.

W tym przykładzie metoda refresh() jest wywoływana bez parametrów, co powoduje odświeżenie wszystkich zarejestrowanych boksów reklamowych. Możesz jednak odświeżyć określone boksy reklamowe, przesyłając tablicę boksów do metody refresh(). Przykład znajdziesz w przykładzie Odśwież boksy reklamowe.

Sprawdzone metody

Podczas pracy z firmą refresh() warto stosować się do sprawdzonych metod.

  1. Nie odświeżaj zbyt szybko.

    Zbyt szybkie odświeżanie boksów reklamowych może powodować ograniczanie żądań reklam. Aby temu zapobiec, nie odświeżaj boksów częściej niż raz na 30 sekund.

  2. Nie wywołaj aplikacji clear() bez potrzeby

    Odświeżając boks reklamowy, nie wywołaj najpierw PubAdsService.clear(). Nie jest to konieczne, ponieważ fragment refresh() zastępuje zawartość określonego boksu niezależnie od tego, czy treść reklamy została wcześniej wczytana. Wywołanie clear() bezpośrednio przed wywołaniem refresh() zwiększy czas widoczności pustego przedziału.

  3. Odświeżaj tylko widoczne boksy reklamowe

    Użycie refresh() do zastąpienia zawartości boksów reklamowych, które nie są widoczne, może znacznie obniżyć współczynnik Widoku aktywnego. Tag impressionVisibleEvent służy do określania, kiedy boks reklamowy ma być widoczny, tak jak w tym przykładzie.

    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();
});