Installation : Shopify

Tout d'abord, assurez-vous que le système de commentaires par défaut de Shopify est désactivé dans Boutique en ligne → Articles de blog → Gérer les blogs → Votre blog → Commentaires (défini sur Désactivé).

Configurer Hyvor Talk

Copiez l'ID de votre site web Hyvor Talk depuis Console → Paramètres → Site web → ID du site web. Vous en aurez besoin lors d'une étape ultérieure.

Configurer le SSO

Par défaut, les utilisateurs ont besoin d'un compte HYVOR pour commenter. Cependant, vous pouvez facilement configurer l'authentification unique pour connecter les comptes Shopify à Hyvor Talk, ce qui permet à vos utilisateurs de commenter facilement.

1. Allez dans Paramètres → Authentification unique et activez le SSO dans votre console Hyvor Talk. Assurez-vous de sélectionner le type Sans état.
2. Générez une clé privée et copiez-la. Vous en aurez besoin à l'étape suivante.
3. Définissez l'URL de connexion. Ce sera YOUR-SHOP-URL/account/login.

Intégrer Hyvor Talk

Passez à votre console Shopify.

1. Allez dans Boutique en ligne → Modifier le thème.
   
2. Ensuite, ajoutez une section Liquid personnalisé à la page ou à l'endroit où vous souhaitez ajouter les commentaires.
   
3. Collez le code suivant dans la section Liquid personnalisé, en remplaçant YOUR_WEBSITE_ID par l'ID de votre site web Hyvor Talk et YOUR_PRIVATE_KEY par la clé privée que vous avez générée à l'étape précédente.

{% assign HT_WEBSITE_ID = YOUR_WEBSITE_ID %}
{% assign PRIVATE_KEY = "YOUR_PRIVATE_KEY" %}
{% assign user_data = "" %}
{% if customer %}
    {% capture user_data %}{
        "id": "{{ customer.id | escape }}",
        "name": "{{ customer.name | escape }}",
        "email": "{{ customer.email | escape }}",
        "timestamp": "{{ 'now' | date: '%s' }}"
    }{% endcapture %}
    {% assign user_data = user_data | base64_encode %}
{% endif %}
{% assign hash = user_data | hmac_sha256: PRIVATE_KEY %}
{% if template contains "product" %}
    {% assign hyvor_page_id = product.id %}
{% elsif template contains "article" %}
    {% assign hyvor_page_id = article.id %}
{% else %}
    {% assign hyvor_page_id = '' %}
{% endif %}
<hyvor-talk-comments
    website-id="{{ HT_WEBSITE_ID }}"
    page-id="{{ hyvor_page_id }}"
    sso-user="{{ user_data }}"
    sso-hash="{{ hash }}"
></hyvor-talk-comments>
<script async src="https://talk.hyvor.com/embed/embed.js" type="module"></script>

C'est tout ! Vous devriez voir les commentaires Hyvor Talk sur votre boutique en ligne. Connectez-vous à votre boutique en tant que client pour tester l'authentification unique.

Anciens thèmes

Si vous avez un ancien thème Shopify, vous devrez modifier les fichiers de votre thème au lieu d'ajouter une section comme à l'étape précédente.

• Ouvrez le fichier Liquid auquel vous souhaitez ajouter les commentaires. Par exemple, product.liquid
• Ensuite, collez le même code que ci-dessus et remplacez l'ID du site web et la clé privée. La seule différence est que vous ajouterez le code directement dans les fichiers Liquid au lieu d'utiliser de nouvelles sections.