Si vos fiches produit WooCommerce sont construites avec Elementor, les étoiles et les avis de Yotpo ne s’affichent pas : l’extension Yotpo les accroche à des emplacements du modèle de produit de WooCommerce qu’Elementor remplace. La solution : créer deux codes courts, un pour les étoiles et un pour les avis, et les placer dans votre modèle avec le widget Code court. Ou utiliser notre extension, qui ajoute deux widgets prêts à l’emploi.
En bref
- Yotpo affiche ses widgets sur des hooks du modèle de produit classique de WooCommerce, absents d’un modèle Elementor.
- Un petit code dans
functions.phpcrée les codes courts[wycan_yotpo_stars_rating]et[wycan_yotpo_reviews_rating]. - Passez l’emplacement des widgets Yotpo sur « Manual » pour éviter les doublons.
- Sans code : notre extension Widgets Yotpo pour Elementor.
Pourquoi les étoiles disparaissent
L’extension Yotpo pour WooCommerce place la note en étoiles dans le résumé du produit, et le bloc d’avis en bas de la fiche. Pour cela, elle utilise des hooks du modèle de produit classique de WooCommerce. Quand vous dessinez votre fiche produit avec le constructeur de thème d’Elementor, ce modèle est remplacé : les hooks ne sont plus appelés, et Yotpo n’a plus d’endroit où s’afficher.
Bonne nouvelle : Yotpo fournit les fonctions qui affichent ses widgets. Il suffit de les appeler là où vous voulez.
Étape 1 : créer les codes courts
Ajoutez ce code à la fin du fichier functions.php de votre thème enfant, ou avec l’extension Code Snippets :
add_shortcode( 'wycan_yotpo_stars_rating', function () {
if ( ! function_exists( 'wc_yotpo_show_buttomline' ) || ! is_product() ) {
return '';
}
ob_start();
wc_yotpo_show_buttomline();
return ob_get_clean();
} );
add_shortcode( 'wycan_yotpo_reviews_rating', function () {
if ( ! function_exists( 'wc_yotpo_show_reviews_widget' ) || ! is_product() ) {
return '';
}
ob_start();
wc_yotpo_show_reviews_widget();
return ob_get_clean();
} );Le premier code court affiche les étoiles et le nombre d’avis, le second le bloc complet des avis. Les fonctions de Yotpo affichent directement leur contenu : ob_start() le récupère pour que le code court le renvoie, comme WordPress l’attend : il s’affiche ainsi exactement à l’emplacement du widget.
Étape 2 : placer les widgets dans le modèle Elementor
- Ouvrez votre modèle de produit unique dans Elementor.
- Glissez un widget Code court sous le titre du produit et saisissez
[wycan_yotpo_stars_rating]. - Glissez un second widget Code court plus bas, par exemple sous la description, avec
[wycan_yotpo_reviews_rating]. - Enregistrez et affichez une fiche produit.
Étape 3 : régler l’emplacement dans Yotpo
Dans les réglages de l’extension Yotpo, l’option Select v3 widget location vaut « Automatic » par défaut. Si votre modèle Elementor conserve certains hooks de WooCommerce, les widgets pourraient alors apparaître deux fois. Passez-la sur « Manual » : seuls vos codes courts afficheront les avis.
Avec les widgets v3 de Yotpo, vérifiez aussi que les identifiants du widget d’avis et du widget d’étoiles sont bien renseignés dans les réglages : sans eux, les étoiles ne s’affichent pas.
Sans code : notre extension
Si vous préférez ne pas toucher au code, on a créé Widgets Yotpo pour Elementor. Elle ajoute deux widgets, Étoiles Yotpo et Avis Yotpo, à glisser dans votre modèle et à mettre en forme depuis Elementor. Un troisième widget affiche la note d’un produit précis sur n’importe quelle page.
Voir la méthode en vidéo sur YouTube
Une extension qui refuse de s’afficher dans votre modèle Elementor ? C’est typiquement le genre de problème qu’on règle. Parlons-en.
