Un logo de site correctement conçu fait partie intégrante de vos pages AMP. Le logo du site AMP est affiché au sein du carrousel de recherche de Google et présente immédiatement votre marque aux internautes. La taille suggérée du logo AMP pour WordPress par Google est de 600 x 60 px. Si vous êtes propriétaire d’un site WordPress, le plugin AMP officiel d’Automattic ne vous offre pas la possibilité de télécharger un logo de site d’une taille de 600 x 60 pixels. Au contraire, les pages AMP générées par le plugin tirent l’icône de site par défaut du thème. Cela peut être un problème car l’icône de site téléchargée par le thème doit être recadrée en un carré qui ne respecte pas les directives appropriées pour les logos AMP.
Pour utiliser un logo personnalisé avec le plugin officiel AMP WordPress qui répond aux directives du logo AMP, vous devrez modifier manuellement le code du plugin pour pointer vers la bonne image. Je vais vous montrer comment le faire afin que votre marque soit correctement affichée par le carrousel de recherche Google.
Comment créer un logo AMP pour les sites WordPress
Etape 1 : Créez un logo dont la taille est de 600 x 60 px. Veillez à suivre les directives relatives au logo AMP.
Pas de problème.
Etape 2 : téléchargez l’image du logo sur votre site WordPress à l’aide de l’option Media > ; Add New du tableau de bord d’administration.
Étape 3 : Copier l’URL de l’emplacement de l’image du logo. Cela peut être fait en cliquant sur l’image à partir de la bibliothèque de médias, puis en copiant l’URL de l’image.
Il est possible de copier l’URL de l’image.
Etape 4 : Depuis le tableau de bord d’administration, naviguez vers Plugins > ; Editor et choisissez AMP dans le menu déroulant et cliquez sur Select pour modifier les fichiers de ce plugin. Cliquez ensuite sur templates puis header-bar.php.
Étape 5 : Repérez le code suivant sous header-bar.php.
<amp-img src= »<?php echo esc_url( $site_icon_url ) ; ?> ; » width= »32″ height= »32″ class= »amp-wp-site-icon »></amp-img>
Étape 6 : modifiez le code comme suit . Vous devez remplacer src= »<?php echo esc_url( $site_icon_url ) ; ?> ; » par le lien vers l’image de votre logo. De plus, vous devrez modifier les attributs width et height en 600 et 60 respectivement. Votre code final ressemblera à ce qui suit :
<amp-img src= »http://link-to-your-logo-image.jpg » width= »600″ height= »60″ class= »amp-wp-site-icon »></amp-img>
Etape 7 : Cliquez sur Mettre à jour le fichier pour sauvegarder votre modification.
C’est tout, maintenant vos pages AMP seront générées avec un logo de site qui répond aux directives de logo AMP.
Voyez également notre guide sur la façon de réparer un élément de données structurées manquant ou invalide sur les pages AMP, qui est causé par l’absence d’une icône de site.