Installer le chat sur un site Vue

Le SDK web pour Vue ajoute le chat à un site Nuxt ou Vue. Il charge le même chat que le code d’installation : les mises à jour du chat arrivent sans mettre à jour le paquet.

Vous utilisez un assistant IA dans votre éditeur de code ? Dans Paramètres de l’App > Développeurs > Démarrage, choisissez « Avec votre assistant IA » et copiez le prompt d’installation, aussi dans Documentation > Démarrage rapide. Il installe le chat pour vous, puis vous dit ce qu’il a fait.

1. Ouvrez Paramètres de l’App > Développeurs > Démarrage. Dans l’étape d’installation, choisissez « Nuxt » ou « Vue » dans « Outil ».
2. Installez le paquet, puis collez le code affiché dans le fichier indiqué au-dessus.
3. Ouvrez votre site sur votre ordinateur : le bouton du chat apparaît en bas de la page.
4. Avant la mise en ligne, saisissez le domaine de votre site dans Paramètres de l’App > Développeurs > Domaine, apps et pages. Le site passe en Production dès que le chat s’affiche sur ce domaine : voir Les modes Développement et Production.

1. Installer le paquet

npm install @zean-chat/vue

2. Ajouter le plugin

Avec Nuxt, créez le plugin app/plugins/zean.ts. Il ne fait rien côté serveur.

import { createZean } from "@zean-chat/vue";export default defineNuxtPlugin(nuxtApp => {  nuxtApp.vueApp.use(createZean({ appKey: "app_your_app_key" }));});

Ce code est un exemple : app_your_app_key tient la place de la vraie clé. Le code avec la clé de votre App, pour Nuxt ou Vue, se trouve dans Paramètres de l’App > Développeurs > Démarrage : copiez-le depuis cette page.

Tant que le Contact a des réponses à lire, l’onglet de votre site affiche leur nombre dans son titre et un point rouge sur son icône. Vos développeurs peuvent le désactiver : voir Afficher le nombre de messages non lus.

Pour vos développeurs

Vue sans Nuxt, le bouton qui ouvre le chat, les messages non lus, l’identité du Contact et la langue : toutes les options sont dans la Documentation > Vue.