HTML et JavaScript

Préparer le site#

Sur la page Agent de l'agent, ouvrez Mettre en ligne → Widget de site web, activez Afficher sur mon site web, puis ajoutez l'origine finale de la page hôte sous Adresses de site web autorisées. Ajoutez séparément les environnements de développement et de production : http://localhost:3000, https://example.com et https://www.example.com ne correspondent pas entre eux.

Installer le script#

Collez le loader juste avant la balise de fermeture </body> sur chaque page qui doit afficher le lanceur. Remplacez uniquement le slug public du site et les valeurs de présentation facultatives.

<script
  src="https://makeagent.fast/embed.js?v=20261022-open"
  data-agent="YOUR_SITE_SLUG"
  data-position="right"
  async
></script>

data-agent est obligatoire. Le slug est public ; aucune clé d'API n'a sa place dans cette balise. Conservez le paramètre ?v= du snippet fourni par le tableau de bord. Les attributs facultatifs data-label, data-accent (#RGB / #RRGGBB), data-locale (en | ko | uz | ru) et data-theme (light | dark) sont décrits dans la Présentation de l'intégration. Omettez-les pour hériter des paramètres Affichage enregistrés et du comportement de thème automatique.

Choisir un placement sur tout le site ou page par page#

Pour un modèle côté serveur partagé, placez le script dans le layout ou le pied de page global. Pour certaines pages seulement, ajoutez-le uniquement dans les modèles concernés. Chargez le même slug une seule fois par document : les balises en double avec le même slug sont ignorées, mais les supprimer rend la gestion et le démontage plus prévisibles.

Ne collez pas le snippet dans un assainisseur HTML ni dans un champ de texte enrichi qui supprime <script>. Vérifiez que la balise figure toujours dans le code source de la page rendue ou dans le panneau Éléments.

Supprimer ou remonter dans une SPA#

Supprimer le script après son exécution ne supprime pas le lanceur qu'il a déjà créé. Une application cliente propre à une route doit supprimer à la fois le script et la racine propre au slug avant de remonter :

const slug = "YOUR_SITE_SLUG";
document.getElementById("maf-agent")?.remove();
document.getElementById(`maf-embed-root-${slug}`)?.remove();

Il est préférable de garder une seule racine à l'échelle du site, montée pendant la navigation côté client, afin que la conversation en cours ne soit pas perdue. Si vous supprimez la racine, ajoutez un nouveau script embed.js pour la recréer.

Vérifier dans le navigateur#

1. Ouvrez la page déployée dans une fenêtre privée.
2. Vérifiez que embed.js renvoie 200 et n'est bloqué ni par la CSP ni par le consentement.
3. Vérifiez qu'une seule racine [data-maf-embed="YOUR_SITE_SLUG"] existe.
4. Ouvrez le lanceur et vérifiez que l'iframe /embed/YOUR_SITE_SLUG se charge.
5. Envoyez une question et vérifiez le fil dans Conversations.
6. Testez la largeur mobile et l'autorisation du microphone lorsque la voix est activée.

Dépannage#

Ne faites jamais transiter le loader par un proxy et ne le copiez pas dans un fork local non vérifié ; utilisez le script hébergé afin que la validation d'origine et les correctifs restent à jour.