<![CDATA[Loadation]]> Mon, 10 Nov 2008 12:09:56 +0100 http://www.loadation.net fr http://www.eklablog.com <![CDATA[Google Adsense & Ajax]]> http://www.loadation.net/article-785-1823-google-adsense-ajax.html Skreo Au début, 2 solutions se présentaient à moi :
- Essayer d'inclure normalement le code de l'annonce : Au premier chargement de la page, pas de problème, mais elle ne s'affiche plus quand le contenu de la page change, car le script ne peut plus être exécuté...
- Utiliser une iframe (eurkk... pas valide...) contenant la pub, rechargée à chaque changement du contenu de la page

Il faut savoir que la page javascript de google (http://pagead2.googlesyndication.com/pagead/show_ads.js) affiche une iframe contenant les annonces avec la fonction document.write, fonction native de javascript. L'astuce consiste à modifier cette fonction, pour gérer l'affichage de la pub.
On va gérer l'affichage de la pub par une fonction qui sera appelée à chaque chargement de page par Ajax. On verra cette fonction après.
Enfin, le dernier problème, c'est que Google n'autorise pas plus de 3 affichages de publicités par page. Et bien sûr, dans un site Ajax, il n'y a pas de rechargement complet de page. Donc à priori, la pub s'affiche au chargement de la page, et aux 2 prochains changements du contenu de la page. Le truc c'est de supprimer toutes les variables créées par Google. Ainsi, Google croit toujours qu'il en est à la première pub.

Voici le code javascript de la fonction qu'on va utiliser pour afficher la pub :

<script type="text/javascript">
 // Affiche la publicité Google
 function showAdGoogle(){
     // On supprime toutes les variables créées par Google :
     for(i in window){
         if(i.substring(0,7)=="google_"){
         window[i] = null;
         }
     }
     // Variables fournies à google pour l'apparence de la pub
     google_ad_client = "pub-8434410332296691"; // Id de l'utilisateur
     google_ad_width = 468;
     google_ad_height = 60;
     google_ad_format = "468x60_as";
     google_ad_type = "text_image";
     google_color_border = "0000FF";
     google_color_bg = "DDDDFF";
     google_color_link = "0000FF";
     google_color_text = "000000";
     google_color_url = "008000";
     var s = document.createElement('script'); // On crée une balise script pour charger le script de Google
     s.type = 'text/javascript';
     s.src = "http://pagead2.googlesyndication.com/pagead/show_ads.js";
     document.body.appendChild(s);
 }
 // Redéfinition de document.write pour l'affichage de la pub Google Adsense
 document.write = function(t){
     var d = document.getElementById("content_pub_google");
     if(d) d.innerHTML += t;
     else document.body.innerHTML += t;
 }
 </script>


Et dans la page, pour afficher la pub :

<div id="content_pub_google" style="width: 468px;"></div>
 <script type="text/javascript">
 showAdGoogle();
 </script>



Lorsque la page est chargée par Ajax, il faut passer le code "showAdGoogle();" dans des balises <js> par exemple, et traiter le xml pour exécuter le js. Et bien sûr il ne faut pas oublier de remettre le div content_pub_google
Pour ça, rien de plus simple : si la variable contenant xml s'appelle reponse :

for(var i=0;i<reponse.getElementsByTagName("js").length;i++)
    setTimeout(reponse.getElementsByTagName("js")[i].firstChild.nodeValue, 0);



Voilà, j'espère que ce petit tuto pourra aider quelqu'un ]]> Sat, 10 Mar 2007 22:55:00 +0100 http://www.loadation.net/article-785-1823-google-adsense-ajax.html