Comment ajouter le chatbot IA Asyntai à Squarespace

Guide étape par étape pour les sites Squarespace

Plateforme :

Étape 1 : Obtenir votre code d'intégration

Tout d'abord, rendez-vous sur votre tableau de bord Asyntai et faites défiler jusqu'à la section « Embed Code ». Copiez votre code d'intégration unique, qui ressemblera à ceci :

<script>(function(){var l=function(){var s=document.createElement("script");s.src="https://widget.asyntai.com/static/js/chat-widget.js";s.async=true;s.setAttribute("data-asyntai-id","YOUR_WIDGET_ID");document.head.appendChild(s)};if(document.readyState==="complete"){l()}else{window.addEventListener("load",l)}})();</script>

Note : Le code ci-dessus n'est qu'un exemple. Vous devez copier votre propre code d'intégration depuis votre Tableau de bord car il contient votre identifiant de widget personnel.

Étape 2 : Ajouter le code avec Code Injection

Si votre site utilise un forfait Squarespace Core, Plus ou Advanced (ou un ancien forfait Business ou Commerce), vous pouvez ajouter le chatbot à toutes les pages en une seule fois avec Code Injection :

Connectez-vous à votre compte Squarespace et ouvrez votre site
Cliquez sur Pages dans le panneau de gauche
Cliquez sur Custom Code en bas du panneau
Cliquez sur Code Injection
Faites défiler vers le bas jusqu'à la section Footer
Collez votre code d'intégration Asyntai dans la zone de texte Footer
Cliquez sur "Save"

Note : Sur Squarespace 7.0, Code Injection se trouve dans Pages → Website Tools.

Astuce : L'ajout du code dans la section Pied de page le place juste avant la balise fermante </body>, ce qui est l'emplacement recommandé pour les widgets de chat et ne ralentira pas le chargement de votre page.

Alternative : Utiliser des blocs de code

Pour ajouter le chatbot uniquement sur certaines pages, vous pouvez utiliser des blocs de code (Code Blocks). Un bloc de code n'exécute JavaScript qu'avec un forfait Core, Plus ou Advanced (ou un ancien forfait Business ou Commerce).

Ouvrez votre site dans l'éditeur Squarespace
Accédez à la page où vous souhaitez ajouter le chatbot
Cliquez sur "Edit" sur la page
Survolez une section et cliquez sur "+ Add Block"
Faites défiler vers le bas et sélectionnez "Code"
Cliquez sur l'icône crayon pour modifier le bloc de code
Collez votre code d'intégration Asyntai
Vérifiez que le menu Mode du bloc est réglé sur HTML
Cliquez en dehors du bloc pour fermer l'éditeur
Cliquez sur "Save"

Important : Avec les blocs de code, vous devez ajouter le code sur chaque page où vous voulez que le chatbot apparaisse. Pour une installation sur tout le site, utilisez la méthode Code Injection ci-dessus.

Étape 3 : Vérifier l'installation

Après avoir enregistré vos modifications, ouvrez votre site web dans un nouvel onglet de navigateur ou en navigation privée. Vous devriez voir le bouton du widget de chat dans le coin inférieur droit. Cliquez dessus pour vérifier qu'il s'ouvre et fonctionne correctement.

Vous ne voyez pas le widget ? Assurez-vous d'avoir enregistré et publié vos modifications. Essayez de vider le cache de votre navigateur ou de consulter votre site dans une fenêtre de navigation privée. Squarespace peut prendre quelques minutes pour appliquer les modifications de code. Le code ne s'exécute parfois pas lorsque vous êtes connecté à Squarespace : vérifiez donc le site dans une fenêtre de navigation privée.

Ajouter la barre de recherche IA

La barre de recherche IA est un widget distinct avec son propre code. Ajoutez-la en plus du chat, ou seule. Elle nécessite le forfait Standard ou supérieur : avec un forfait inférieur, la barre apparaît mais ne renvoie pas de résultats.

Ajoutez l’attribut data-replace à la balise script : la barre remplace alors celle de votre thème. Ajoutez-le dans Pages, Custom Code, Code Injection, Footer, au même endroit que le code du chat. Squarespace ne propose Code Injection qu'avec un forfait Core, Plus ou Advanced (ou un ancien forfait Business ou Commerce), vous avez donc besoin de l'un d'eux pour l'installer.

<script src="https://widget.asyntai.com/static/js/search-widget.js" data-asyntai-id="YOUR_WIDGET_ID" data-replace="auto" async></script>