Controlar o carregamento e a atualização de anúncios

Nos exemplos de conceitos básicos e de início, o método display() da biblioteca de Tag do editor do Google (GPT) é usado para registrar e mostrar um slot de anúncio. No entanto, há momentos em que pode ser preferíveis ou mesmo necessárias para separar essas ações, com o objetivo de controlar precisamente quando o conteúdo do anúncio é carregado. Por exemplo, ao trabalhar com um plataforma de gestão de consentimento ou solicitação de conteúdo do anúncio como resultado de um usuário à ação.

Neste guia, exploraremos os mecanismos fornecidos pela GPT para controlar o carregamento de conteúdo de anúncios e buscar novos conteúdos de anúncios sob demanda. Código completo para este exemplo pode ser encontrada nas solicitações com base em eventos página de amostra.

Controlar o carregamento de anúncios

Por padrão, o comportamento do método display() é: registrar, solicitar e renderizar conteúdo do anúncio em um espaço de anúncio. A otimização automática a solicitação e a renderização de conteúdo do anúncio podem ser desativadas usando o método PubAdsService.disableInitialLoad().

Com o carregamento inicial desativado, as chamadas para display() só vão registrar o espaço do anúncio. Nenhum conteúdo de anúncio será carregado até que uma segunda ação seja realizada. Isso permite que você controlar com precisão quando as solicitações de anúncios são feitas.

Para evitar solicitações de anúncios não intencionais, disableInitialLoad() precisa ser chamado antes de ativar o serviço e chamar 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>

Neste exemplo, o carregamento inicial é desativado, garantindo que nenhuma solicitação de anúncio seja feita. e nenhum conteúdo de anúncio é renderizado quando display() é chamado. O espaço está pronto para aceitar e mostrar um anúncio, mas uma solicitação de anúncio não será feita até que o espaço seja atualizado.

Atualizar

O método PubAdsService.refresh() é usado para preencher um espaço com novo conteúdo de anúncio. Esse método pode ser usado em espaços com ainda não carregando conteúdo (devido a disableInitialLoad()) ou para substituir o conteúdo de um espaço já preenchido. No entanto, apenas os slots que foram registrados ao chamar display() estão qualificados para atualização.

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

Neste exemplo modificado, quando um usuário clica no botão "Mostrar/atualizar anúncio" , o o método refresh() seja chamado. Isso aciona uma solicitação para buscar um novo conteúdo do anúncio e carregue-o no espaço registrado, substituindo qualquer conteúdo pré-existente.

No exemplo anterior, o método refresh() é chamado sem que atualizam todos os espaços de anúncio registrados. No entanto, também é possível atualizar locais de anúncio específicos transmitindo uma matriz de locais para o método refresh(). Confira o exemplo de atualização de slots de anúncios para conferir um exemplo.

Práticas recomendadas

Ao trabalhar com refresh(), é preciso seguir algumas práticas recomendadas.

Não atualize rápido demais.

Atualizar os espaços de anúncio muito rapidamente pode causar a limitação das suas solicitações de anúncio. Para evitar isso, evite atualizar os slots com mais frequência do que uma vez a cada 30 segundos.
Não chame clear() desnecessariamente

Ao atualizar um espaço do anúncio, não chame PubAdsService.clear() primeiro. Isso não é necessário, porque refresh() substitui o conteúdo do slot especificado, independentemente do se algum conteúdo de anúncio foi carregado anteriormente. Chamar clear() imediatamente antes de chamar refresh() só vai aumentar o tempo que um slot em branco fica visível para o usuário.

Atualizar apenas espaços de anúncio visíveis

O uso de refresh() para substituir o conteúdo de slots de anúncios que nunca são visualizados pode reduzir significativamente a taxa de ActiveView. O O ImpressionViewableEvent pode ser usado para determinar quando um espaço de anúncio ficou visível, como mostrado exemplo:

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