Insérer des adsense en Javascript après le chargement de la page

La solution propre aurait été d’utiliser la fonction suivante :

display_adsense = function(client, slot, width, height, div) {
  if (document.referrer == "") {
    return(0);    
  }

  var referrers = ["/search", "search.live.com", "ask.com", "images.google", "soso.com", "baidu"];

  for (var i = 0; i < referrers.length; i++) {
    if (document.referrer.toLowerCase().indexOf(referrers[i]+'') != -1) {
      google_ad_client = client;
      google_ad_slot = slot;
      google_ad_width = width;
      google_ad_height = height;

      var e = document.createElement("script");
      e.type = "text/javascript";
      e.src = "http://pagead2.googlesyndication.com/pagead/show_ads.js";
      document.getElementById(div).appendChild(e);
      return(0);
    }
  }  
}

L’appel se faisant dans le window.onload :

window.onload = function() {
   display_adsense("client", "slot", width, height, div);
}

Il est ainsi possible de placer plusieurs encarts publicitaires sur une même page.

Malheureusement, ça ne marche pas, et les comportements sont très différents en fonction des navigateurs (et pas toujours très rationnels).

Si j’utilise le window.onload :

<li>Firefox 3 : affiche une page blanche et tourne en boucle sans rien charger.</li>
<li>Safari : affiche la bannière adsense au bon endroit, ou à la fin du document, selon les fois, de manière totalement aléatoire.</li>
<li>Internet Explorer 7 : rien ne s'affiche, sauf quand je rajoute un alert("toto") dans le code, histoire de valider que ma fonction est bien interprétée.</li>

Si j’appelle simplement ma fonction en bas du document :

<li>Firefox 3 : affiche la bannière n'importe où dans le document. Firebug me montre bien une div vide, et la publicité dans une div aléatoire (souvent la sidebar, mais pas toujours).</li>
<li>Safari : affiche au bon endroit, ou à la fin du document, selon les fois, de manière totalement aléatoire.</li>
<li>Internet Explorer 7 : affiche le bloc adsense à la fin du document systématiquement, sauf quand je rajoute un alert("toto") dans le code, histoire de valider que ma fonction est bien interprétée.</li>

Selon Anthony Ricaud, cela pourrait venir du fait que Google utilise document.write pour afficher ses encarts publicitaires. Tenter de modifier le DOM après le chargement complet du document avec un script tentant un document.write serait à l’origine de tous mes problèmes, lesquels m’ont pris, au passage, une bonne partie de la journée.

La solution retenue est particulièrement sale, mais a le mérite de fonctionner : appeler ma fonction depuis les div de destination et utiliser moi aussi du document.write.

Ma fonction finale donne alors :

display_adsense = function(client, slot, width, height, div) {
  if (document.referrer == "") {
    return(0);    
  }

  var referrers = ["/search", "search.live.com", "ask.com", "images.google", "soso.com", "baidu"];

  for (var i = 0; i < referrers.length; i++) {
    if (document.referrer.toLowerCase().indexOf(referrers[i]+'') != -1) {
      google_ad_client = client;
      google_ad_slot = slot;
      google_ad_width = width;
      google_ad_height = height;
            document.write('<script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_ads.js"></script>');
      return(0);
    }
  }  
}

L’appel de la fonction se fait alors comme ceci :

<div id="adsense">
    <script type="text/javascript">
        display_adsense(client, slot, width, height);
    </script>
</div>

[Edit]

Je rajoute également la méthode proposée par Sunny Rippert :

function display_adsense(client, slot, width, height, element_id) {
  var referrers = /(/search|search</span>.live</span>.com|ask</span>.com|images</span>.google|soso</span>.com|baidu)/i;
  if (!document.referrer.match(referrers))


<span class="kw">return</span>;


  google_ad_client = client;
  google_ad_slot = slot;
  google_ad_width = width;
  google_ad_height = height;

   document.write(’<script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_ads.js"></script>’);
}

J’ai également utilisé la méthode utilisant DOMContentLoaded (et ses adaptations sur les navigateurs ne la supportant pas), et le résultat est encore pire, notamment sous Firefox. Si vous connaissez une méthode qui fonctionne pour faire ça proprement, n’hésitez pas à vous signaler, je suis preneur.