Ajouter des commentaires aux sites Shopify
FastComments est disponible sur le Shopify App Store. Installez l'application et déposez des blocs FastComments sur n'importe quel article de blog, page produit ou page personnalisée depuis l'éditeur de thème Shopify. Aucune modification de code n'est nécessaire.
Lorsque vous installez l'application, Shopify provisionne votre compte FastComments, configure le domaine de votre boutique et connecte la facturation automatiquement. Vous n'avez pas besoin de vous inscrire séparément sur fastcomments.com.
Les pages de ce guide couvrent chaque bloc FastComments fourni par l'application, le fonctionnement de l'authentification unique (single sign-on) pour vos clients Shopify, et comment importer les commentaires Shopify existants avant de basculer.
Installer l'application FastComments 
Installer depuis le Shopify App Store
- Ouvrez la liste FastComments sur le Shopify App Store.
- Cliquez sur Add app et choisissez le plan souhaité pendant le processus d'installation.
- Shopify vous redirige vers l'administration FastComments dans Shopify une fois l'installation terminée.
C’est l’installation complète. Il n’y a rien à coller dans vos fichiers de thème.
Ce qui est configuré pour vous
L’installation exécute tout ce que vous feriez manuellement :
- Un locataire FastComments est créé pour votre boutique et lié à votre domaine de boutique.
- L’URL de votre boutique est ajoutée aux domaines autorisés du locataire, de sorte que les commentaires se chargent sans erreur de domaine.
- Un champ méta de boutique
fastcomments.tenant_idest écrit afin que chaque bloc sache quel locataire utiliser. - L’authentification unique (SSO) pour vos clients Shopify est activée par défaut.
- La facturation passe par Shopify Managed Pricing. Les frais apparaissent sur votre facture Shopify habituelle. Mettez à niveau, rétrogradez ou annulez depuis Settings > Apps and sales channels > FastComments dans votre admin Shopify.
Si votre boutique était déjà cliente FastComments avant d’installer l’application, l’installation réutilise le locataire existant au lieu d’en créer un nouveau.
L’administration intégrée
Lorsque vous ouvrez l’application FastComments depuis votre admin Shopify, vous accédez à un tableau de bord avec des tuiles en un clic vers le backend complet de FastComments :
- Dashboard : paramètres du compte, utilisation et détails de l’abonnement.
- Moderation Queue : approuver, rejeter et répondre aux commentaires dans toute votre boutique.
- Customize : ajuster les couleurs du widget, les polices, les règles de modération et la configuration.
- Ratings & Reviews Helper : configurer les évaluations par étoiles et les questions d’avis si vous souhaitez utiliser le bloc Résumé des avis.
Chaque tuile ouvre FastComments avec un lien de connexion à usage unique, vous n’avez donc pas besoin d’une connexion séparée.
Prochaine étape : ajouter des blocs à votre boutique
Ouvrez l’éditeur de thème Shopify (Online Store > Themes > Customize), ouvrez le modèle auquel vous souhaitez ajouter des commentaires ou des avis, puis cliquez sur Add block. Les blocs FastComments apparaissent sous Apps. Le reste de ce guide couvre chacun d’eux.
Ajouter des commentaires aux articles de blog et aux produits
Le bloc FastComments est le widget de commentaires principal. Ajoutez-le aux modèles d'articles de blog, aux modèles de produits, ou à toute autre page où vous souhaitez un fil de discussion ou un chat en direct.
Ajouter le bloc
- Ouvrez l'éditeur de thème Shopify (Boutique en ligne > Thèmes > Personnaliser).
- Choisissez le modèle sur lequel vous souhaitez des commentaires : Article de blog, Produit, ou tout autre modèle de page ou de section.
- Dans la section où vous souhaitez que les commentaires apparaissent, cliquez sur Ajouter un bloc.
- Sous Applications, sélectionnez FastComments.
- Cliquez sur Enregistrer.
Le bloc apparaît immédiatement. Il n'y a pas de Tenant ID à saisir ; le tenant de votre boutique est configuré automatiquement lors de l'installation de l'application.
Paramètres
| Paramètre | Fonction | Valeur par défaut |
|---|---|---|
| Tenant ID (facultatif) | Remplace le tenant FastComments utilisé par le bloc. Laissez vide pour utiliser le tenant configuré automatiquement pour la boutique. Vous pouvez trouver un Tenant ID manuel sur fastcomments.com/auth/my-account/api-secret. | (vide) |
| SSO | Connecte automatiquement le visiteur avec son compte client Shopify avant de commenter. Voir Connexion automatique des clients Shopify. | Activé |
| Style de commentaires | Threaded pour des réponses imbriquées et des votes, ou Streaming pour un fil de chat en temps réel. | Threaded |
| Custom URL ID | Remplace l'identifiant de page détecté automatiquement. Utilisez-le lorsque vous souhaitez que deux URL partagent un même fil de commentaires. | (détection automatique) |
Comment l'identifiant de page est choisi
Chaque fil de commentaires est associé à un URL ID. Le bloc en choisit un automatiquement :
- Modèle d'article de blog :
shopify-article-{article.id}, qui reste stable malgré les changements de slug et de titre. - Modèle de produit :
shopify-product-{product.id}, qui reste stable malgré les changements de slug et de titre. - Autres modèles : le chemin de la requête.
Si vous définissez un Custom URL ID, cette valeur est utilisée à la place. Utilisez le même Custom URL ID sur plusieurs blocs (par exemple, sur une variante localisée d'une page produit) pour partager un même fil de commentaires.
Threaded vs Streaming
Threaded est le mode par défaut. Les visiteurs se répondent, votent, et les outils de modération fonctionnent normalement. Idéal pour les articles de blog et les avis produits.
Streaming supprime l'imbrication et affiche les nouveaux commentaires en temps réel dès leur publication, comme un fil de chat. Idéal pour les lancements de produits, les événements en direct et les pages communautaires.
Plusieurs blocs sur la même page
Le bloc peut être ajouté plusieurs fois au même modèle. Par exemple, un Résumé des avis en haut d'une page produit et un bloc FastComments en bas. Les blocs partagent un URL ID, de sorte que le résumé reflète les commentaires situés en dessous.
Conseils
- Le bloc se masque dans l'aperçu de l'éditeur de thème avec une notice jaune s'il ne trouve pas de tenant. Si cela apparaît dans votre boutique en ligne, réinstallez l'application FastComments.
- Pour une page produit, le bloc FastComments fait également office de widget d'avis produits. Associez-le à FastComments - Reviews Summary pour afficher un résumé avec notation par étoiles en haut de la page.
Ajouter un badge de compteur de commentaires
Le bloc FastComments - Comment Count affiche un petit nombre de commentaires pour une seule page. Utilisez-le dans les listes d'articles de blog, les fiches produit, ou tout modèle qui renvoie vers une page avec des commentaires, afin que les visiteurs puissent voir l'activité de chaque discussion avant de cliquer.
Ajouter le bloc
- Ouvrez l'éditeur de thème Shopify.
- Ouvrez le modèle où vous souhaitez que le compteur apparaisse. Par exemple, le modèle Blog (la liste d'articles) ou une section de liste de produits.
- Cliquez sur Ajouter un bloc dans la section qui affiche chaque élément.
- Sous Applications, sélectionnez FastComments - Comment Count.
- Cliquez sur Enregistrer.
Paramètres
| Paramètre | Fonction | Valeur par défaut |
|---|---|---|
| Tenant ID (facultatif) | Remplace le tenant FastComments à partir duquel le compteur lit les données. Laissez vide pour utiliser le tenant configuré automatiquement pour la boutique. | (vide) |
| Custom URL ID | Remplace l'identifiant de page recherché par le compteur. Utilisez-le lorsque le compteur se trouve sur une page différente du bloc FastComments qu'il suit. | (détection automatique) |
Correspondance entre le compteur et le fil de commentaires
Le bloc Comment Count utilise la même logique de détection automatique que le bloc FastComments :
- Modèle d'article de blog :
shopify-article-{article.id} - Modèle de produit :
shopify-product-{product.id} - Autres modèles : le chemin de la requête
Si vous définissez un Custom URL ID sur le bloc FastComments d'une page, définissez le même Custom URL ID sur le bloc Comment Count afin qu'ils pointent vers le même fil de discussion.
Conseils
- Les compteurs de tous les éléments de la page sont récupérés en une seule requête, donc ajouter le bloc à chaque élément d'une longue liste n'entraîne aucun coût supplémentaire d'aller-retour.
- Un bloc Comment Count par article ou produit dans une liste est l'utilisation prévue ; le bloc peut être ajouté autant de fois que nécessaire.
Ajouter un flux de commentaires récents
Le FastComments - Recent Comments block affiche les commentaires les plus récents dans l’ensemble de votre boutique. Utilisez-le pour montrer une activité récente dans une barre latérale, le pied de page ou une section de la page d’accueil.
Ajouter le bloc
- Ouvrez l’éditeur de thème Shopify.
- Ouvrez le gabarit où vous voulez le flux. Une section de barre latérale, la page d’accueil ou l’index du blog conviennent bien.
- Cliquez sur Ajouter un bloc dans la section qui doit le contenir.
- Sous Applications, sélectionnez FastComments - Recent Comments.
- Cliquez sur Enregistrer.
Paramètres
| Setting | What it does | Default |
|---|---|---|
| Tenant ID (optionnel) | Remplace le tenant FastComments que le flux lit. Laisser vide pour utiliser le tenant automatiquement configuré par la boutique. | (vide) |
| Number of comments | Combien de commentaires récents afficher. Plage de 1 à 50. | 5 |
Conseils
- Chaque commentaire contient un lien vers la page sur laquelle il a été posté, donc le bloc sert aussi d’indication de navigation "ce dont les gens parlent en ce moment".
- Le flux couvre toute la boutique. Pour afficher les commentaires récents d’une seule page, utilisez plutôt le bloc FastComments sur cette page.
Ajouter un flux de discussions récentes
Le bloc FastComments - Recent Discussions liste les pages de votre boutique ayant l'activité de commentaires la plus récente, avec une entrée par page. Utilisez-le lorsque vous souhaitez que les visiteurs découvrent des discussions actives plutôt que des commentaires individuels.
Ajouter le bloc
- Ouvrez l'éditeur de thème Shopify.
- Ouvrez le modèle où vous souhaitez afficher le flux, par exemple une barre latérale, un pied de page, un index de blog ou une section de page d'accueil.
- Cliquez sur Add block dans la section qui doit le contenir.
- Sous Apps, sélectionnez FastComments - Recent Discussions.
- Cliquez sur Save.
Paramètres
| Paramètre | Fonction | Valeur par défaut |
|---|---|---|
| Tenant ID (facultatif) | Remplace le tenant FastComments à partir duquel le flux lit les données. Laissez vide pour utiliser le tenant configuré automatiquement pour la boutique. | (vide) |
| Nombre de commentaires | Nombre de discussions récentes à afficher. Plage de 1 à 50. | 20 |
Recent Discussions vs Recent Comments
Les deux blocs s'appuient sur les mêmes données, mais affichent des vues différentes :
- Recent Comments : une liste plate des derniers commentaires individuels. Idéal pour « ce qui vient d'être dit ».
- Recent Discussions : une entrée par page, classée par activité la plus récente. Idéal pour « quelles discussions sont actives en ce moment ».
Vous pouvez utiliser les deux sur la même boutique. Par exemple, Recent Comments dans la barre latérale du blog et Recent Discussions sur la page d'accueil.
Ajouter une liste des pages les plus populaires
Le bloc FastComments - Top Pages affiche les pages de votre boutique ayant le plus d'activité de commentaires au global. Utilisez-le pour mettre en avant vos articles ou produits les plus commentés.
Ajouter le bloc
- Ouvrez l’éditeur de thème Shopify.
- Ouvrez le modèle où vous voulez la liste, par exemple une barre latérale, le pied de page, ou la section d'index du blog.
- Cliquez sur Ajouter un bloc dans la section qui doit le contenir.
- Sous Applications, sélectionnez FastComments - Top Pages.
- Cliquez sur Enregistrer.
Paramètres
| Paramètre | Fonction | Par défaut |
|---|---|---|
| Tenant ID (optionnel) | Remplace le tenant FastComments à partir duquel la liste est lue. Laissez vide pour utiliser le tenant automatiquement configuré de la boutique. | (vide) |
Top Pages vs Recent Discussions
- Top Pages classe par engagement total, donc les mêmes publications ont tendance à rester en haut pendant un certain temps. Idéal pour une barre latérale "articles populaires".
- Recent Discussions classe par activité la plus récente, donc la liste se renouvelle rapidement. Idéal pour un panneau "ce qui est populaire en ce moment".
Ajouter un résumé des avis
Le bloc FastComments - Résumé des avis affiche une note étoilée agrégée et une répartition des avis pour une page. Associez-le au bloc FastComments sur les modèles de produit pour la mise en page standard des avis : résumé en haut, formulaire d'avis et avis en dessous.
Prérequis : configurer Ratings & Reviews
Le bloc Résumé des avis affiche les questions d'évaluation que vous avez configurées pour votre boutique. Configurez-les d'abord :
- Ouvrez l'application FastComments dans votre administration Shopify.
- Cliquez sur la tuile Ratings & Reviews Helper (ou ouvrez directement Ratings & Reviews Helper).
- Ajoutez les questions que vous souhaitez que chaque évaluateur réponde (note globale en étoiles, « comment était la taille », etc.).
Sans questions configurées, le bloc résumé n'a rien à agréger.
Ajouter le bloc
- Ouvrez l'éditeur de thème Shopify.
- Ouvrez le modèle Product (ou le modèle de page où vous voulez le résumé).
- Cliquez sur Add block près du haut de la section de la page, au-dessus de l'endroit où se trouvera le bloc FastComments.
- Sous Apps, sélectionnez FastComments - Reviews Summary.
- Ajoutez un bloc FastComments plus bas sur la même page si vous ne l'avez pas déjà fait, afin que les visiteurs puissent laisser des avis.
- Cliquez sur Save.
Paramètres
| Setting | What it does | Default |
|---|---|---|
| Tenant ID (optional) | Remplace le tenant FastComments dont le résumé lit les données. Laissez vide pour utiliser le tenant configuré automatiquement pour la boutique. | (vide) |
| Custom URL ID | Remplace l'identifiant de page contre lequel le résumé s'agrège. Utilisez ceci lorsque le résumé se trouve sur une page différente du bloc FastComments qu'il reflète. | (auto-detected) |
Comment le résumé correspond aux avis
Le bloc Résumé des avis utilise la même logique de détection automatique que le bloc FastComments :
- Modèle produit :
shopify-product-{product.id} - Modèle d'article de blog :
shopify-article-{article.id} - Autres modèles : le chemin de la requête
Pour une page produit normale, le résumé et le fil de commentaires partagent automatiquement un ID d'URL, sans configuration nécessaire.
Conseils
- Le résumé est en lecture seule. Pour collecter des avis, vous avez besoin d'un bloc FastComments sur la même page.
- Si vous modifiez les questions d'évaluation dans Ratings & Reviews Helper après avoir collecté des avis, le résumé est recalculé en fonction du nouvel ensemble de questions.
Connexion automatique des clients Shopify
Le bloc FastComments prend en charge l'authentification unique (SSO) afin que vos clients Shopify puissent commenter en leur nom sans créer un compte FastComments séparé.
Comment cela fonctionne
Lorsque un visiteur connecté à votre boutique ouvre une page contenant le bloc FastComments :
- Le bloc détecte l'objet Shopify
customer. - Il envoie le nom et l'email du client à FastComments via une requête d'app proxy signée.
- FastComments crée ou associe un utilisateur identifié par
shopify-{customerId}, de sorte que le même client corresponde toujours au même utilisateur FastComments entre les sessions et les réinstallations. - Le nom du visiteur apparaît sur ses commentaires. Il n'est pas invité à se connecter de nouveau.
Si le visiteur n'est pas connecté à la boutique, le bloc revient au commentaire anonyme (ou au flux de connexion FastComments, selon la configuration de votre widget).
Désactiver le SSO
Le SSO est activé par défaut pour chaque bloc FastComments. Pour le désactiver sur un bloc spécifique :
- Ouvrez l'éditeur de thème Shopify.
- Ouvrez le modèle qui contient le bloc et cliquez sur le bloc pour le sélectionner.
- Décochez SSO.
- Cliquez sur Enregistrer.
Désactivez le SSO si vous souhaitez que les commentateurs choisissent une identité distincte pour la conversation. Par exemple, une page communautaire interne où le personnel commente sous un autre nom d'affichage.
Ce que FastComments reçoit
La charge utile SSO envoyée pour chaque client contient :
- Un identifiant d'utilisateur dérivé de l'ID client Shopify (
shopify-{customerId}). - L'email du client (utilisé pour identifier l'utilisateur ; non affiché publiquement).
- Le nom d'affichage du client (utilisé comme nom d'auteur de son commentaire).
Aucun historique de commandes, donnée de paiement ou adresse n'est envoyé. La charge utile est signée côté serveur ; le navigateur du client ne voit jamais de justificatif d'identité.
Liens de connexion et de déconnexion
Lorsque le SSO est activé, les liens de connexion et de déconnexion du widget de commentaires pointent vers /account/login et /account/logout, les routes standard de compte client Shopify. Il n'y a rien à configurer. Les liens fonctionnent pour toute boutique ayant les comptes clients activés.
Importer les commentaires existants
Si vous avez déjà des commentaires sur vos articles de blog Shopify et souhaitez les conserver, importez-les dans FastComments avant de désactiver le système de commentaires natif de Shopify.
L'importation doit être effectuée tant que le système de commentaires natif de Shopify est encore actif et visible. Une fois que vous le désactivez, FastComments ne peut plus les lire.
Comment démarrer une importation
- Assurez-vous que l'application FastComments est installée sur votre boutique.
- Laissez le système de commentaires natif de Shopify activé pour l'instant.
- Ouvrez un ticket d'assistance et indiquez-nous quels blogs importer.
L'importation s'effectue en moins d'une journée.
Une fois vos commentaires existants importés dans FastComments, ajoutez le bloc FastComments à votre modèle d'article de blog et supprimez ou désactivez les commentaires natifs de Shopify. Voir Ajouter des commentaires aux articles de blog et aux produits.
Si vous n'avez pas besoin de conserver les commentaires existants, vous pouvez ignorer cette page.
Personnalisation
Les couleurs, les polices, les règles de modération, le HTML autorisé et les commentaires anonymes peuvent tous être configurés pour correspondre à l'identité visuelle de votre boutique.
Ouvrez l'application FastComments dans l'administration Shopify et cliquez sur la tuile Customize pour ouvrir l'écran de personnalisation du widget. Elle utilise un lien de connexion à usage unique, vous n'avez donc pas besoin d'une authentification séparée.
Pour la liste complète des options de personnalisation, consultez le Guide de personnalisation et de configuration.
Erreurs de domaine
Si vous avez installé FastComments depuis le Shopify App Store, le domaine de votre boutique est automatiquement ajouté aux domaines autorisés du locataire et vous ne devriez pas rencontrer d'erreur de domaine. Cette page s'applique si vous êtes passé par l'installation manuelle, ou si votre vitrine est hébergée sur un domaine personnalisé qui n'était pas enregistré auprès de Shopify au moment de l'installation de l'application.
Vous pouvez recevoir une erreur d'autorisation ressemblant à ceci :
Cela signifie que FastComments ne reconnaît pas le domaine sur lequel le widget se charge comme étant autorisé pour votre locataire.
Pour le corriger, ajoutez le domaine à votre compte FastComments : Configurer les domaines.
Installation manuelle (avancée)
Si vous ne pouvez pas installer l'application Shopify App Store, vous pouvez toujours ajouter FastComments en modifiant votre thème. Cette méthode est utile lorsque vous souhaitez connecter un tenant FastComments que vous possédez déjà, ou lorsque vous intégrez sur une vitrine Shopify où l'application n'est pas disponible.
L'installation via l'application est la méthode prise en charge pour la plupart des boutiques. N'utilisez cette méthode que si l'application ne convient pas.
Étape 1 : Désactiver les commentaires natifs de Shopify
Dans votre administration Shopify, allez dans Articles de blog > Gérer les blogs, ouvrez chaque blog et sélectionnez Commentaires désactivés dans le panneau de droite. Enregistrez.
Cela empêche le système de commentaires intégré de Shopify d'apparaître en même temps que FastComments.
Étape 2 : Ouvrir le modèle de thème du blog
Dans votre administration Shopify :
- Allez dans Boutique en ligne > Thèmes.
- Sous votre thème actuel, cliquez sur Actions > Modifier le code.
- Dans l'explorateur de fichiers à gauche, ouvrez Sections et cliquez sur
main-article.liquid.
C'est le modèle que Shopify affiche pour un article de blog unique.
Étape 3 : Collez l'extrait FastComments
Faites défiler jusqu'à environ la ligne 100 de main-article.liquid, juste après la balise de fermeture </div> du corps de l'article. Collez l'extrait suivant :
Remplacez "demo" par votre propre Tenant ID depuis fastcomments.com/auth/my-account/api-secret. Cliquez sur Enregistrer.
Étape 4 : Autoriser le domaine de votre boutique
Ouvrez un article de blog sur votre boutique en ligne. Si vous voyez une erreur d'autorisation à la place du widget de commentaires, FastComments doit connaître les domaines autorisés pour utiliser ce tenant. Consultez Erreurs de domaine.
Ajouter FastComments à d'autres pages
Le même extrait fonctionne sur n'importe quel modèle Liquid, y compris les pages produit, les pages personnalisées et la page d'accueil. Collez-le à l'endroit où vous voulez que les commentaires apparaissent et ajustez urlId si vous souhaitez un identifiant stable par page (par exemple, urlId: "{{ product.id }}" dans un modèle produit).
Ajouter des sondages à votre boutique Shopify
Une fois FastComments installé sur votre boutique Shopify, vous pouvez également lancer des sondages en direct directement dans les commentaires. Activez Enable Polls dans les paramètres de personnalisation de votre widget et un bouton de sondage apparaît dans la barre d’outils des commentaires. Les sondages acceptent de 2 à 10 options, les résultats se mettent à jour en direct pour tous les visiteurs de la page, et vous décidez qui peut créer des sondages et si le vote nécessite une connexion. Il n’y a rien d’autre à installer sur Shopify.
Essayez la démo des sondages en direct ou lisez la documentation des sondages pour les configurer.