Comment ajouter un chatbot IA d'Alibaba Cloud à votre site WordPress

Créez une nouvelle instance de chatbot

Ouvrez votre navigateur, rendez‑vous sur console.alibabacloud.com et connectez‑vous. Dans la barre de recherche en haut à droite, tapez « Chatbot » puis appuyez sur Entrée ; une liste de services IA apparaît. Cliquez sur le bouton Create Robot (ou un bouton similaire comme Create Instance). Un formulaire apparaît vous demandant un nom et une brève description. Après avoir saisi un nom tel que “FrontDeskHelper” et cliqué sur Create, la plateforme lance un nouveau bot et l’affiche dans un tableau avec le statut “Running”. Si vous ne voyez pas de bouton “Create Robot”, cherchez une icône en forme de plus ou un menu intitulé New Bot.

Vous saurez que cela a fonctionné lorsque la nouvelle entrée apparaît dans la liste avec un point vert ou le mot “Running”.

Définissez le message de bienvenue du chatbot

Dans la liste des bots, cliquez sur le nom du bot que vous venez de créer pour ouvrir sa page de paramètres. Dans le menu de gauche, vous trouverez une section nommée Greetings (parfois intitulée Welcome Message). À l’intérieur, il y a une zone de texte où vous pouvez saisir la première phrase que le bot dit aux visiteurs. Après avoir tapé une phrase telle que « Hi! I’m your digital assistant – ask me about opening hours or services », un aperçu du message apparaît sous la zone de texte. Cliquez sur Save pour enregistrer la modification. Si le menu indique “Chat Prompt” au lieu de Greetings, il s’agit du même champ – cherchez simplement une grande zone de texte.

Vous saurez que cela a fonctionné lorsque la boîte d’aperçu affiche exactement le texte saisi et qu’une bannière de confirmation apparaît.

Choisissez un style visuel qui correspond à votre site

Toujours dans les paramètres du bot, passez à l’onglet Appearance, Style ou Customization – l’intitulé peut varier, mais il contient généralement une palette de couleurs et un téléchargeur d’icône. Choisissez une couleur qui reflète la teinte principale de votre site (vous pouvez copier le code hexadécimal, par ex. #0066CC) et téléversez un petit logo (un PNG de 100 × 100 pixels fonctionne bien). L’aperçu à droite se met à jour pour afficher une bulle de chat dans la couleur choisie avec votre logo comme avatar. Si vous ne trouvez pas de sélecteur de couleur, cherchez une icône d’engrenage ⚙️ qui ouvre les « Theme Settings ».

Vous saurez que cela a fonctionné lorsque la bulle affichée à l’écran reflète la couleur et l’icône que vous avez sélectionnées.

Copiez le code d’intégration du widget

Retournez à la page principale du bot et appuyez sur le bouton Publish ou Deploy – cela indique à Alibaba Cloud de rendre le bot accessible publiquement. Un nouveau panneau intitulé Embed Code, Web Widget ou similaire glisse, contenant un extrait qui commence par <script src="..."></script>. Cliquez sur le bouton Copy à côté de la zone ; le code se trouve alors dans le presse‑papiers de votre ordinateur. S’il n’y a pas de bouton Copy, cliquez dans la zone, puis appuyez sur Ctrl + C (or Cmd + C sur Mac) pour le copier manuellement.

Vous saurez que cela a fonctionné lorsque vous pouvez coller l’extrait dans un document texte brut et voir l’intégralité de la balise <script> apparaître.

Insérez le code dans le pied de page WordPress

Connectez‑vous à votre tableau de bord WordPress (votre‑site.com/wp‑admin). Dans le menu de gauche, allez à Appearance → Widgets. Repérez la zone de widget appelée Footer (ou « Footer 1 » etc.). Cliquez sur Add a Block, choisissez Custom HTML, puis collez le code que vous avez copié dans la zone de texte du bloc. Appuyez sur le bouton Update ou Save en haut de l’écran. Le site charge désormais le script sur chaque page, et une bulle de chat devrait apparaître dans le coin inférieur droit lorsque vous visualisez le front‑end. Si vous ne voyez pas de zone de widget Footer, installez le plugin gratuit « Insert Headers and Footers », puis allez dans Settings → Insert Headers and Footers, collez le code dans la zone « Scripts in Footer » et enregistrez.