Rocket Loader avec AdSense : comment éviter les problèmes ?

Rocket Loader de Cloudflare peut poser des problèmes de compatibilité avec certains scripts, y compris Google AdSense. Par défaut, Rocket Loader essaie de différer le chargement des scripts JavaScript pour améliorer les performances, mais cela peut entraîner des conflits ou des retards dans l’affichage des annonces AdSense. Les annonces peuvent apparaître en retard ou ne pas se charger correctement.

Solutions pour utiliser Rocket Loader avec AdSense :

Désactiver Rocket Loader pour AdSense uniquement : vous pouvez dire à Rocket Loader de ne pas interférer avec les scripts AdSense en utilisant l’attribut data-cfasync= »false » dans les balises <script> liées à AdSense. Cela permet de désactiver Rocket Loader uniquement pour les scripts AdSense tout en conservant son effet sur les autres éléments de votre page.

Voici un exemple de comment modifier votre code AdSense pour désactiver Rocket Loader :

<div class="adsense-ad">
    <ins class="adsbygoogle"
         style="display:block; text-align:center;"
         data-ad-layout="in-article"
         data-ad-format="fluid"
         data-ad-client="ca-pub-123456XXXXXX"
         data-ad-slot="752XXXXXXXX"></ins>
    <script data-cfasync="false">
        (adsbygoogle = window.adsbygoogle || []).push({});
    </script>
</div>

En ajoutant data-cfasync= »false » à la balise <script>, vous empêchez Rocket Loader de retarder le chargement des scripts AdSense, ce qui devrait résoudre les problèmes de compatibilité tout en conservant l’optimisation pour le reste de votre site.

Ajouter la balise data-cfasync= »false » sur l’ensemble de vos scripts AdSense

Il est nécessaire d’ajouter cet attribut sur l’ensemble des scripts AdSense. Si vous utilisez actuellement des solutions tierces pour ajouter le code de vos annonces, il faudra donc ajouter cette balise spécifique à Rocket Loader.

Pour les utilisateurs de WordPress et Google Site Kit, il est donc nécessaire de désactiver l’insertion du code AdSense et insérer manuellement le code, par exemple avec le fichier functions.php.

function ajouter_adsense_header() {
    ?>
    <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-123456XXXXXX" 
    crossorigin="anonymous" data-cfasync="false"></script>
    <?php
}

add_action('wp_head', 'ajouter_adsense_header');

Tester avant déploiement :

Comme AdSense est une source importante de revenus, il est essentiel de tester le comportement des annonces sur votre site après avoir activé Rocket Loader avec cette solution. Vous pouvez vérifier si les annonces se chargent correctement et si les performances globales de la page sont améliorées.

Si vous remarquez toujours des problèmes avec AdSense et Rocket Loader, il peut être préférable de désactiver complètement Rocket Loader sur les pages qui affichent des annonces ou de ne l’activer que pour les pages où la publicité n’est pas aussi critique.

Si vous appréciez nos articles, ne manquez les prochains en vous abonnant à Cosmo Games sur Google News, vous pouvez également nous suivre sur X (ex Twitter). N'hésitez pas à partager vos réactions, commentaires ou remarques dans les commentaires, afin d'enrichir le contenu, de mieux vous comprendre et intégrer les différents points de vue.