2

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?

Community
  • 1
  • 1
Mad Echet
  • 3,723
  • 7
  • 28
  • 44

2 Answers2

6

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.

Mad Echet
  • 3,723
  • 7
  • 28
  • 44
  • So you had to define a unique adslot for each ad shown on the site right? Must have been a pretty small site? – Kevin Jun 14 '12 at 20:00
  • Yes, it is a webapp so very few pages that are rendered a lot of times. Refreshing ads is a life saver here. – Mad Echet Jun 17 '12 at 17:29
  • This is excellent. I didn't even know about DFP before. Had to make a few mods to get it to run for me. googletag.display has to be called once before googletag.pubads().refresh is called. – Tom Kincaid Dec 14 '12 at 19:43
  • Can anyone apply to DFP? – Andres SK Dec 17 '14 at 22:13
  • I think so but it takes a while to get the account validated. It's DoubleClick fo Publishers (small business) – Mad Echet Dec 19 '14 at 17:34
0

Maybe using jQuery's getScript() method would help in this situation. I propose that you try to include this inside a pageinit function. Let me give you a brief example.

$(document).delegate('[data-role=page]','pageinit',function(){ // this would get executed on page init of every JQM page
    $.getScript('path/to/yourlib.js',function(){ // using getScript should help you be able to load scripts since the head doesn't get loaded again
       Demo(); //This would be code that your lib uses
    });
});
codaniel
  • 5,263
  • 1
  • 23
  • 32
  • Thanks for your replay. Your solution works to execute the script but inserting a ` – Mad Echet Apr 11 '12 at 08:55