Comment ajouter le widget Conversational AI d'ElevenLabs à votre site Wix

Vous cherchez à améliorer votre service client et engagement en ajoutant le Conversational AI d'ElevenLabs à votre site Wix. Vous êtes au bon endroit. Ce guide vous accompagne pas à pas, vous aidant à éviter les pièges courants.

Avant de commencer

Avant de débuter, assurez-vous d'avoir les éléments suivants :

1. Compte premium Wix : L'intégration de JavaScript personnalisé est uniquement disponible sur les plans Premium.
2. Compte ElevenLabs : Vous avez besoin d'un compte ElevenLabs pour créer des agents IA conversationnels. Inscrivez-vous ici.
3. Accès à l'éditeur Wix avec le mode Dev activé : Vous aurez besoin du mode Dev pour ajouter du code personnalisé à votre site.

Guide étape par étape

Étape 1 : Préparez votre widget ElevenLabs

1. Connectez-vous à votre compte ElevenLabs.
2. Allez dans la section IA conversationnelle.
3. Configurez votre agent conversationnel et copiez le code d'intégration JavaScript fourni.

Étape 2 : Activez le mode Dev dans Wix

1. Ouvrez votre site Wix dans l'éditeur.
2. Cliquez sur Mode Dev dans le menu supérieur pour activer les fonctionnalités avancées comme l'ajout de code personnalisé.

Remarque : Si le mode Dev n'est pas visible, assurez-vous d'utiliser l'éditeur complet de Wix, et non le Wix ADI (Intelligence de Design Artificielle).

Étape 3 : Ajoutez le code d'intégration JavaScript

1. Allez dans Paramètres > Code personnalisé dans l'éditeur Wix.
2. Cliquez sur + Ajouter du code personnalisé.
3. Collez le code JavaScript d'ElevenLabs dans le champ prévu.
4. Sous Appliquer le code à, sélectionnez Toutes les pages (ou choisissez une page spécifique pour le widget).
5. Enregistrez et publiez vos modifications.

Problèmes courants et dépannage

Vous avez rencontré un problème avec l'ajout d'un widget IA conversationnelle à votre site Wix ? Suivez ces étapes simples pour résoudre votre problème.

Problème 1 : Le widget se déconnecte ou ne se charge pas

• Cause : Configuration incorrecte de la liste blanche ou utilisation d'un plan Wix gratuit.
• Solution : Assurez-vous que l'URL de votre site est soit retirée de la liste blanche, soit correctement configurée dans le tableau de bord ElevenLabs.

Problème 2 : JavaScript ne fonctionne pas

• Cause : Le code JavaScript n'a pas été ajouté correctement.
• Solution : Vérifiez que le JavaScript est collé dans le bon champ sous Code personnalisé.

Problème 3 : Plan Wix gratuit

• Cause : L'intégration de JavaScript personnalisé n'est pas prise en charge sur les plans Wix gratuits.
• Solution : Passez à un plan Premium Wix.

Conseils avancés

Si vous souhaitez créer la meilleure expérience possible pour les visiteurs de votre site, consultez ces meilleures pratiques avancées.

Ajustement de la liste blanche

Si votre widget ne fonctionne toujours pas après l'intégration du code, suivez ces étapes :

1. Connectez-vous à votre compte ElevenLabs.
2. Allez dans les paramètres de la liste blanche pour votre agent IA conversationnel.
3. Assurez-vous que le domaine de votre site est correctement ajouté. Si les problèmes persistent, essayez de retirer votre domaine de la liste blanche et de tester à nouveau.

Test sur un domaine en direct

Le widget peut ne pas fonctionner correctement en mode aperçu de Wix. Publiez votre site et testez-le sur le domaine en direct pour vous assurer qu'il fonctionne comme prévu.

Test de compatibilité entre navigateurs

Une fois votre widget en ligne, testez-le dans plusieurs navigateurs, tels que Chrome, Firefox, Edge et Safari. Certaines fonctionnalités peuvent se comporter différemment selon les navigateurs en raison des variations dans la gestion de JavaScript.

1. Ouvrez votre site sur chaque navigateur.
2. Interagissez avec le widget et vérifiez sa réactivité.
3. Recherchez des problèmes tels que des styles cassés ou des erreurs de fonctionnalité. Si des problèmes surviennent, vérifiez votre code JavaScript ou contactez le support ElevenLabs pour obtenir des conseils.

Réactivité mobile

Vérifiez que le widget fonctionne parfaitement sur les appareils mobiles, car de nombreux utilisateurs accèdent aux sites via des smartphones ou des tablettes.

1. Utilisez l'éditeur mobile de Wix pour prévisualiser la mise en page mobile de votre site.
2. Testez le widget sur des appareils physiques pour confirmer sa fonctionnalité et sa facilité d'utilisation.
3. Vérifiez les éléments qui se chevauchent ou les problèmes de formatage. Si des ajustements sont nécessaires, utilisez les outils de conception mobile de Wix pour optimiser le placement et la taille.

Conseils de débogage JavaScript

Si votre widget ne fonctionne pas comme prévu, les outils de développement des navigateurs peuvent aider à identifier les problèmes.

1. Ouvrez votre site dans un navigateur (Chrome recommandé).
2. Cliquez avec le bouton droit n'importe où sur la page et sélectionnez Inspecter pour ouvrir les DevTools.
3. Allez dans l'onglet Console et recherchez les messages d'erreur liés au widget.
4. Si vous voyez des erreurs, vérifiez le code d'intégration JavaScript et assurez-vous que toutes les URL nécessaires sont ajoutées à la liste blanche. Cette méthode peut également mettre en évidence les dépendances manquantes ou d'autres problèmes empêchant le bon fonctionnement du widget.

Dernières réflexions

Intégrer le widget IA conversationnelle d'ElevenLabs dans Wix nécessite une configuration minutieuse, mais avec les bonnes étapes, vous pouvez le faire fonctionner rapidement. Assurez-vous d'avoir un plan Premium Wix, suivez les étapes ci-dessus et résolvez les problèmes courants si nécessaire. Si vous rencontrez d'autres problèmes, contactez le support d'ElevenLabs pour obtenir de l'aide.

Ou, si ce n'est pas déjà fait, inscrivez-vous pour l'IA conversationnelle dès aujourd'hui.