Le code du badge Google Avis clients est le premier extrait de code (il y en a deux) que vous devez insérer pour l'intégration dans le programme. L'affichage du badge est facultatif. Si vous rencontrez des difficultés lors de l'ajout du code du badge, essayez les solutions proposées par cet article du Centre d'aide.
Cette section porte sur les éléments suivants :
Instructions d'intégration
Pour intégrer le badge Google Avis clients à une page, procédez comme suit :
Ces tâches sont décrites dans les sections ci-dessous.
Lorsque vous intégrez le code du badge à vos pages, l'image suivante s'affiche (la valeur de la note peut varier) :
Dans la plupart des cas, vous devez avoir reçu au moins 100 avis dans un pays donné au cours de l'année passée pour que votre avis sur le marchand apparaisse sur le badge.
Le badge ne doit être masqué par aucun autre contenu sur les pages de votre site.
Mettre à jour le DOCTYPE
Assurez-vous que les pages Web auxquelles vous intégrez le badge utilisent le DOCTYPE HTML5 :
<!DOCTYPE html>
Ce DOCTYPE doit être le premier élément du code HTML de votre page. L'utilisation du DOCTYPE HTML5 garantit que les navigateurs Web affichent vos pages en mode standard, pas en mode "quirks". Le mode "quirks" est une technique utilisée par certains navigateurs Web afin de maintenir la compatibilité avec les pages Web conçues pour des navigateurs plus anciens, au lieu de respecter strictement les normes W3C et IETF en mode standard.
Ajouter le badge Google Avis clients
Pour montrer à vos clients que vous utilisez Google Avis clients, ajoutez le badge du programme sur toutes les pages du site Web où vous souhaitez qu'il apparaisse.
Si vous souhaitez que le badge soit aligné, utilisez la méthode décrite ci-dessous. Sinon, utilisez la méthode suivante pour placer le badge Google Avis clients en bas à droite ou en bas à gauche de la page.
Pour ajouter le badge Google Avis clients à votre site, procédez comme suit :
-
Collez l'extrait de code suivant sur votre page Web :
<!-- DÉBUT du code d'affichage du badge Google Avis clients -->
<script src="https://apis.google.com/js/platform.js?onload=renderBadge"
async defer>
</script><script>
ID_MARCHAND
window.renderBadge = function() {
var ratingBadgeContainer = document.createElement("div");
document.body.appendChild(ratingBadgeContainer);
window.gapi.load('ratingbadge', function() {
window.gapi.ratingbadge.render(
ratingBadgeContainer, {
// OBLIGATOIRE
"merchant_id":,
POSITION
// FACULTATIF
"position": ""
});
});
}
</script>
<!-- FIN du code d'affichage du badge Google Avis clients -->Placez le code sur la page, juste avant la balise de fermeture
</BODY>
. Lorsque vous le placez avec le code de la fonction d'acceptation des enquêtes, leur ordre n'a pas d'importance. - Remplacez les variables par les valeurs dynamiques spécifiques à votre site. Le tableau suivant présente les paramètres disponibles :
Variable Obligatoire ? Description MERCHANT_ID
Obligatoire Votre ID Merchant Center. Cette valeur est disponible dans Google Merchant Center. POSITION
Facultatif Déclenche l'affichage du badge à l'un des emplacements suivants : - "BOTTOM_RIGHT" : déclenche l'affichage "flottant" du badge en bas à droite de la page.
- "BOTTOM_LEFT" : déclenche l'affichage "flottant"du badge en bas à gauche de la page.
- "INLINE" : déclenche l'affichage du badge à l'emplacement du code. Lorsque vous utilisez cette option, assurez-vous qu'aucun autre élément de la page ne masque le badge. Pour une méthode plus simple, consultez la section ajouter le badge intégré Google Avis clients.
L'emplacement par défaut du badge est "BOTTOM_RIGHT".
- Spécifiez la langue du badge en collant l'extrait de code suivant sur votre page Web :
<!-- DÉBUT du code de la langue d'affichage de Google Avis clients --> <script> window.___gcfg = { lang: 'LANGUE' }; </script> <!-- FIN du code de la langue d'affichage de Google Avis clients -->
Placez le code sur la page, juste avant la balise de fermeture
</BODY>
. Lorsque vous le placez avec le code du badge, leur ordre n'a pas d'importance.Définissez la valeur du paramètre
lang
en remplaçant LANGUE par l'une des langues acceptées suivantes :- af
- ar
- cs
- da
- de
- en
- en-AU
- en-GB
- en-US
- es
- es-419
- fil
- fr
- ga
- id
- it
- ja
- ms
- nl
- no
- pl
- pt-BR
- pt-PT
- ru
- sv
- tr
- zh-CN
- zh-TW
Si vous n'indiquez pas de valeur pour le paramètre
lang
, le badge utilise les paramètres du navigateur de l'utilisateur pour sélectionner automatiquement la langue. - Répétez les étapes 1 à 3 pour toutes les pages de votre site Web sur lesquelles vous souhaitez afficher le badge.
- Pour finaliser l'intégration de Google Avis client, vous devez ajouter le module de la fonction d'acceptation des enquêtes sur la page de confirmation de commande. L'ajout de ce module est obligatoire.
Pour ajouter le badge Google Avis clients en tant qu'élément en ligne (inline), procédez comme suit :
-
Collez la ligne suivante avant la balise de fermeture </BODY> dans votre page HTML afin de charger le code JavaScript pour le badge :
<script src="https://apis.google.com/js/platform.js" async defer></script>
- Dans votre code HTML, collez cette ligne là où vous souhaitez que le badge s'affiche sur votre page :
<g:ratingbadge merchant_id=ID_MARCHAND></g:ratingbadge>
Remplacez
ID_MARCHAND
par votre propre ID Merchant Center. -
Indiquez la langue du badge en appliquant la méthode décrite ici.
-
Ajoutez le module de la fonction d'acceptation des enquêtes à votre page de confirmation de commande. L'ajout de ce module est obligatoire.
Exemple de code du badge
L'exemple suivant présente le code permettant de placer le badge en bas à gauche de la page, pour la référence marchand 42 :
<!-- DÉBUT du code d'affichage du badge Google Avis clients -->
<script src="https://apis.google.com/js/platform.js?onload=renderBadge"
async defer>
</script>
<script>
window.renderBadge = function() {
var ratingBadgeContainer = document.createElement("div");
document.body.appendChild(ratingBadgeContainer);
window.gapi.load('ratingbadge', function() {
window.gapi.ratingbadge.render(
ratingBadgeContainer, {
"merchant_id": 42,
"position": "BOTTOM_LEFT"
});
});
}
</script>
<!-- FIN du code d'affichage du badge Google Avis clients -->
<!-- DÉBUT du code de la langue d'affichage de Google Avis clients -->
<script>
window.___gcfg = {
lang: 'en_US'
};
</script>
<!-- FIN du code de la langue d'affichage de Google Avis clients -->
Si le badge n'apparaît pas sur votre page ou que des erreurs s'affichent pendant le chargement de la page, essayez les solutions proposées par cet article du Centre d'aide.