Help improve the Google Publisher Tag developer experience. Share your thoughts in our survey.

Tag pages with infinite content

You can dynamically generate new ad content using the Google Publisher Tag library.

Competitive exclusions and roadblocks are only gauranteed to be honored for ads served by either a single Single request architecture (SRA) request or a sequence of serial SRA requests. Making multiple SRA requests in parallel may result in competitive ads being displayed on the same page.

A sample of the full code you would use to implement tags with infinite page contents is shown below. The sample features a button on the bottom of the page to dynamically generate new content.

<!doctype html>
<html>
  <head>
    <title>Infinite content example</title>
    <script async src="https://securepubads.g.doubleclick.net/tag/js/gpt.js"></script>
    <script>
      window.googletag = window.googletag || {cmd: []};

      googletag.cmd.push(function() {
        // Declare slots initially present on the page
        googletag.defineSlot('/6355419/Travel', [728, 90], 'leaderboard')
            .setTargeting("test","infinitescroll")
            .addService(googletag.pubads());

        // Enable SRA to honor competetive exclusions and roadblocks.
        googletag.pubads().enableSingleRequest();

        // Enable services
        googletag.enableServices();
      });

      // Function to add content to page
      function moreContent() {
        // Define the slot itself, register it and fetch an ad.
        googletag.cmd.push(function() {
          var slot = googletag.defineSlot('/6355419/Travel', [728, 90])
              .setTargeting('test', 'infinitescroll')
              .addService(googletag.pubads());

          var div = document.createElement('div');
          div.id = slot.getSlotElementId(); // auto-generated by GPT
          document.body.appendChild(div);

          // Call display() to register the slot as ready and fetch an ad.
          googletag.display(slot);
        });
      }
    </script>

    <style>
      body > div {
        margin-bottom: 5em;
        border: solid 1px black;
        width: 728px
      }
      body > button {
        position: fixed;
        bottom: 10px;
      }
    </style>
  </head>
  <body>
    <h1>GPT Test Page - Infinite Content</h1>

    <!-- First ad -->
    <div id="leaderboard">
      <script>
        // Call display() to register the slot as ready and fetch an ad.
        googletag.cmd.push(function() {
          googletag.display('leaderboard');
        });
      </script>
    </div>

    <!-- Button to load more content dynamically. -->
    <button onclick="moreContent()">More Content</button>
  </body>
</html>