Si aucune annonce AdSense n’est chargée, comment afficher une image avec lien ?

Si aucune annonce AdSense n'est chargée, comment afficher une image avec lien

Pour afficher une image avec un lien à la place d’une annonce AdSense qui ne se charge pas, vous pouvez utiliser le concept de fallback (solution de secours). Cela permet par exemple d’afficher une bannière provenant d’une régie d’affiliation.

Voici une approche simple pour y parvenir en utilisant du code JavaScript et HTML :

Étapes à suivre

  1. Localiser votre code AdSense : Recherchez l’emplacement où vous avez inséré le code AdSense.
  2. Ajouter le code JavaScript pour le fallback : Utilisez un script pour détecter si une annonce AdSense s’est chargée correctement. Si ce n’est pas le cas, le script remplacera l’emplacement de l’annonce par une image avec un lien.

Voici un exemple de code que vous pouvez insérer dans votre page où vous placez vos annonces AdSense.

Exemple de Code

<div class="adsense-container">
    <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
    <!-- AdSense Code -->
    <ins class="adsbygoogle"
         style="display:block"
         data-ad-client="ca-pub-XXXXXXXXXXXXXXX"
         data-ad-slot="XXXXXXXXXXX"
         data-ad-format="auto"></ins>
    <script>
        (adsbygoogle = window.adsbygoogle || []).push({});
    </script>
</div>

<script>
    // Attendre quelques secondes pour voir si l'annonce s'affiche
    setTimeout(function() {
        var adsenseContainer = document.querySelector('.adsense-container ins');
        if (adsenseContainer && adsenseContainer.innerHTML.replace(/\s/g, '').length === 0) {
            // Si l'annonce ne s'affiche pas, remplacez par une image avec un lien
            document.querySelector('.adsense-container').innerHTML = '<a href="https://votre-lien.com"><img src="https://votre-site.com/image.jpg" alt="Votre image publicitaire"></a>';
        }
    }, 2000); // Attendre 2 secondes pour s'assurer que l'annonce n'est pas chargée
</script>

Si vous avez plusieurs annonces et que vous souhaitez appliquer la même logique, il faudra adapter le code. Par exemple, utilisez un nom de class spécifique à la place de « adsense-container » ou encore rechercher la balise ins avec un data-ad-slot spécifique (chaque annonce AdSense à un numéro unique).

Explications

  • AdSense code : Le script original d’AdSense est toujours là, et il tente de charger l’annonce comme d’habitude.
  • Fallback script : Si, après 2 secondes, l’annonce ne s’est pas chargée (détecté par le fait que le conteneur ins est vide), une image de secours avec un lien sera insérée à la place.
  • Personnalisation : Remplacez les valeurs suivantes :
  • data-ad-client et data-ad-slot par vos informations AdSense.
  • L’URL de l’image et du lien dans la partie innerHTML du script.

Utilisation dans WordPress

  • Si vous utilisez un thème personnalisé, vous pouvez insérer ce code dans les fichiers PHP (comme header.php, footer.php, ou dans un widget HTML).
  • Si vous avez un constructeur de pages (comme Elementor), vous pouvez insérer ce code directement dans un bloc HTML ou JavaScript.

Cela permet d’éviter d’avoir un espace vide lorsque les annonces ne se chargent pas, tout en maintenant un contenu visuel attrayant pour vos utilisateurs.

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.

Publications similaires

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *