Une fois la demande d'annonce effectuée, les blocs d'annonces AdSense sont actualisés pour indiquer s'ils ont été remplis ou non par une création. Vous pouvez vérifier le pourcentage de vos blocs d'annonces non remplis en consultant votre couverture moyenne dans les rapports AdSense.
Lorsqu'un bloc d'annonces a fini de demander une annonce, AdSense ajoute le paramètre data-ad-status
à l'élément <ins>
. Remarque : data-ad-status
ne doit pas être confondu avec data-adsbygoogle-status
, qui permet de traiter les annonces dans notre code d'annonce.
Selon qu'une annonce a été renvoyée ou non, ce paramètre est modifié de l'une des deux façons suivantes :
data-ad-status="filled" |
Une annonce a été renvoyée au bloc d'annonces et elle est actuellement diffusée. |
data-ad-status="unfilled" |
Aucune annonce n'a été renvoyée, et le bloc d'annonces est vide. |
Traitement des blocs d'annonces non remplis par AdSense
Lorsque les blocs d'annonces AdSense ne sont pas remplis (unfilled
), nous essayons de les réduire ou d'afficher un espace vide. Nous ne réduisons les blocs d'annonces que s'ils n'entraînent aucun ajustement de la mise en page. Autrement dit, seuls ceux en dehors de la fenêtre d'affichage sont réduits. Pour tous les autres blocs d'annonces non remplis, nous conservons leur taille et les remplaçons par un espace vide.
Masquer les blocs d'annonces non remplis
(avancé) Vous pouvez choisir d'amplifier ce comportement via CSS ou JavaScript. Par exemple, si vous souhaitez masquer tous les blocs d'annonces non remplis, vous pouvez utiliser CSS pour appliquer un style display: none !important;
à l'élément.
Exemple 1 : Masquer les blocs d'annonces non remplis via CSS
Vous pouvez ajouter le style CSS suivant à votre page pour masquer automatiquement les blocs d'annonces non remplis :
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<ins class="adsbygoogle"
style="display:block"
data-ad-client="ca-pub-1234567890123456"
data-ad-slot="1234567890"
data-ad-format="auto"
data-full-width-responsive="true"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
ins.adsbygoogle[data-ad-status="unfilled"] {
display: none !important;
}
Exemple 2 : Afficher une image uniquement si le bloc d'annonces n'est pas rempli
Si un bloc ne diffuse aucune annonce, vous pouvez choisir d'afficher une auto-promotion à la place :
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<ins class="adsbygoogle"
style="display:inline-block;width:300px;height:250px"
data-ad-client="ca-pub-1234567890123456"
data-ad-slot="1234567890">
<a href="/page"><img src="/backup.jpg" width="300px" height="250px"></a>
</ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
ins.adsbygoogle a {
display: none !important;
}
ins.adsbygoogle[data-ad-status="unfilled"] a {
display: block;
}
Si vous préférez mettre à jour votre page à l'aide de JavaScript, vous pouvez utiliser MutationObserver afin de détecter les modifications apportées au paramètre data-ad-status
et d'exécuter du code JavaScript en fonction de ces changements.
Limites
Le paramètre data-ad-status
n'est ajouté qu'aux blocs d'annonces présents dans la fenêtre supérieure. Autrement dit, il n'est pas inséré dans les blocs d'annonces diffusés via une fenêtre multidomaine.
Par ailleurs, nous vous déconseillons de charger les blocs d'annonces AdSense comme masqués dès le début et de les rendre visibles après la modification du paramètre data-ad-status
. S'ils ne sont pas visibles dès le début sur la page, il est possible que nous ne puissions pas exécuter la demande d'annonce pour ces blocs d'annonces.