Wpcours

Des tuto, thèmes et plugins pour Wordpress

  • WORDPRESS
  • TUTORIELS
  • PLUGINS
  • WP-SEO
  • THEMES
  • Blogger
  • Contact

Comment personnaliser la taille des blocs d’annonces responsive Adsense

Màj le 16 avril 2021

Les annonces responsives (réactives) Adsense sont un meilleur moyen d’afficher des annonces sur des sites avec un design réactif . Dans ce tutoriel on va apprendre comment personnaliser ces annonces pour afficher des tailles d’annonces recommandées qui ont tendance à payer plus, donc la personnalisation des annonces réactives est très importante surtout si Adsense est votre seule seule source de revenue

Cet article explique comment personnaliser vos annonces responsives Adsense. la première étape est de générer une adunit Adsense :

 

personnaliser la taille des blocs d'annonces responsive Adsense
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- ADUnit -->
<ins class="adsbygoogle"
 style="display:block"
 data-ad-client="ca-pub-xxxxxx"
 data-ad-slot="yyyyyy"
 data-ad-format="auto"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>

Voici un exemple d’Adunit responsive asynchrone Adsense, cela vérifiera automatiquement la largeur disponible pour l’annonce et affichera automatiquement une taille d’annonce appropriée, mais les tailles d’annonce responsive peuvent différer et elles peuvent être de n’importe quelle taille qui ne sont même pas répertoriées sur Adsense Guide, il est donc très important de les personnaliser pour afficher les tailles d’annonces recommandées les plus performantes.

Comment personnaliser les annonces responsives pour afficher une taille spécifique en fonction de la largeur disponible?

<script async src = "// pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"> </script>

Comme vous allez utiliser les Adcodes asynchrones, incluez simplement le script ci-dessus une fois dans la section head de votre HTML et supprimer le de tous les autres codes Adsense.

Voici un exemple d’annonce d’en-tête, il est généralement préférable d’utiliser 320 × 100 et 728 × 90, mais vous pouvez également utiliser 468 × 60, ce qui est une meilleure taille pour les tablettes:

<style>
.headerad { width: 320px; height: 100px; }
@media(min-width: 468px) { .headerad { width: 468px; height: 60px; } }
@media(min-width: 728px) { .headerad { width: 728px; height: 90px; } }
</style>
<!-- Header Ad -->
<ins class="adsbygoogle headerad"
 style="display:inline-block"
 data-ad-client="ca-pub-xxxx"
 data-ad-slot="yyyy"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>

Pour les largeurs d’écran jusqu’à 467, une grande bannière mobile de taille 320 × 100 sera diffusée. Pour des largeurs d’écran comprises entre 468 et 727, une bannière de taille 468 × 60 sera diffusée pour tous les autres écrans. Une annonce Leaderboard 728 × 90 sera diffusée.

Les tailles de grandes bannières mobiles sont les plus recommandées de toute façon. Une annonce 468 × 60 sera un bon choix pour les tablettes de taille moyenne Voici un exemple d’annonces dans la barre latérale:

<style>
.sidebarad { width: 300px; height: 250px; }
@media(min-width: 336px) { .sidebarad { width: 336px; height: 280px; } }
</style>
<!-- Sidebar Ad -->
<ins class="adsbygoogle sidebarad"
 style="display:inline-block"
 data-ad-client="ca-pub-xxxx"
 data-ad-slot="yyyy"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>

Pour les largeurs d’écran jusqu’à 335, une annonce Rectangle moyen de taille 300 × 250 sera diffusée. Pour toutes les autres largeurs d’écran, une annonce Grand Rectangle de taille 336 × 280 sera diffusée.

Voici quelques autres façons de personnaliser une unité publicitaire réactive, mais l’utilisation des méthodes suivantes n’est pas recommandée :

<ins class = "adsbygoogle"
 style = "affichage: bloc;"
 data-ad-client = "ca-pub-xxxx"
 data-ad-slot = "yyy"
 data-ad-format = "horizontal"> </ins>
<script> (adsbygoogle = window.adsbygoogle || []). push ({}); </script>
<ins class="adsbygoogle"
 style="display:block;"
 data-ad-client="ca-pub-xxxx"
 data-ad-slot="yyy"
 data-ad-format="vertical"></ins>
<script>(adsbygoogle = window.adsbygoogle || []).push({});</script>
<ins class="adsbygoogle"
 style="display:block;"
 data-ad-client="ca-pub-xxxx"
 data-ad-slot="yyy"
 data-ad-format="rectangle"></ins>
<script>(adsbygoogle = window.adsbygoogle || []).push({});</script>

Dans les trois exemples ci-dessus, le format d’annonce de données est différent, il peut être configuré comme horizontal, vertical et rectangle.

On arrive à la fin de notre petit tutoriel sur la façon de personnaliser les annonces responsives Adsense pour générer plus de revenue avec Adsense.


Vous aimerez également...

  • Ajouter une icône de site (favicon) à WordPress facilement
  • Comment désactiver la sauvegarde automatique dans L’éditeur Gutenberg de WordPress?
  • Comment réparer l’erreur « 503 Service Unavailable » dans WordPress
  • 4 etapes pour passer son blog wordpress en https
  • Comment ajouter une animation de préchargement à WordPress
  • Comment trouver le nombre de recherches d’un mots-clés sur Google

Classé sous :Tutoriels

Accueil / Tutoriels / Comment personnaliser la taille des blocs d’annonces responsive Adsense

Laisser un commentaire

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

Ne manquez plus rien
Abonnez-vous

Abonnez-vous dès maintenant à la Newsletters de Wpcours et recevez des tutoriels Gratuitement.

CREER VOTRE AVATAR GRATUIT

Articles récents

  • 5 façons pour trouver la clé de produit (serial) Windows facilement
  • Ajouter une Image mise en avant (featured image) sous le titre de vos article
  • 13 thèmes WordPress polyvalents pour sites des crypto-monnaies pour obtenir un site bien classé
  • C’est quoi l’API WordPress Heartbeat et pourquoi devriez-vous la contrôler ?
  • Créer un message d’incitation à réautoriser les annonces Adsense sans plugin

© 2023 ·Wpcours.com · Mentions · Contact