Home/ Questions/Q 7903677
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-03T09:48:31+00:00

I have been reading the web and trying out things for days looking for

  • 0

I have been reading the web and trying out things for days looking for a way to show the Google Adsense ads through jQuery mobile transitions without breaking the ToS. I am a bit stuck so I turn to the wisest community.

The Adsense tag is made of three scripts (i) a general one, (ii) a list of slots and (iii) the display itself. The first two go in the <head>, the latter in the <body>.

I can display the ads on my first page just fine. The problem comes with page transition.

Since jQuery Mobile does not reload the <head>, an option is to prepare the googletag while loading the <head> the first time. This sets the limit to a maximum of three ads per page, which, across a whole site is not a lot. Plus it means that you will have to move ad <div> around, which is not so great either. Finally, it means that you may load ads and not display them until the user goes to the page where it belongs, if ever. Which is not so ToS compatible either.

Is there a way to load a fresh new ad on each transition? If yes, where do I put the Google scripts to make sure they load properly?

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    I found a way to get it to work in Google DFP with Adsense plugged into DFP. DFP is more flexible so it was easier.

    Here is what I used:

    • In the <head>: I put the google scripts and defined all the adslots for the whole website (you will get it with the “generate tags”).
    • On each page: you put the <body> part of the script like you would do anywhere else.

    With this, you will be able to get a new ad served each time you load a new page. However, if you browse between pages, you will never get them to refresh.

    To make for this, you can use googletag.pubads().refresh(). However, you want to only refresh the slots that are in the page that you are loading, otherwise you break some terms and conditions. Plus, you cannot refresh slots that have not been displayed yet, so it will fail if you defined slots for the whole website but all the pages have not been loaded yet, which is quite likely.

    But you can pass the slots that are in the current page to the refresh() function. Here is how I did it:

    function refreshAds() {
  // Get all the slots
  var allSlots = googletag.pubads().getSlots();
  var slotsToRefresh = Array();
  // Select the slots that are on the current page based on their dom Id
  for (var i=0; i<allslots.length; ++i)
    if (isSlotIdOnTheCurrentPage(allSlots[i].getSlotId().getDomId())) 
      slotsToRefresh.push(allSlots[i]); // I let you implement the logic behind naming ids slots and divs
  if (slotsToRefresh.length > 0)
    googletag.pubads().refresh(slotsToRefresh);
}

$(document).on("pagechange", function() {refreshAds();})

    There you go, each time you go back to a page, the slots are refreshed, each time you go to a new page, a new slot is created (provided that it was defined in the <head>).

    I hope it will help! There might be a way to get it to work seamlessly in Adsense but I did not try.

    • 0