commen integre t on les pluggin des agents dans un site internet ou un webservice - là j'ai essayé | ElevenLabs | Page 1

AI-generated Answer for lazlo_88026

Voici la manière officielle d’intégrer un agent ElevenLabs dans un site ou un service web, et d’éviter l’icône/bouton flottant par défaut.

Intégration web (widget)

Rendez l’agent public (authentification désactivée) dans l’onglet Advanced, puis restreignez l’accès avec un domain allowlist pour la sécurité. (elevenlabs.io)
Intégrez le widget dans le body de votre page. Pour ne pas afficher seulement le petit bouton et ouvrir le panneau directement, ajoutez l’attribut variant="expanded" (et, si besoin, empêchez la réduction avec dismissible="false"). Exemple:
<elevenlabs-convai agent-id="VOTRE_AGENT_ID" variant="expanded"></elevenlabs-convai>
<script src="https://unpkg.com/@elevenlabs/convai-widget-embed" async type="text/javascript"></script>
(elevenlabs.io)
Personnalisez l’apparence/texte du lanceur et du panneau via l’onglet Widget du dashboard ou via les attributs HTML (action-text, avatar-image-url, etc.). (elevenlabs.io)
Si vous avez besoin d’un contrôle total (inline, mise en page, états, etc.), utilisez les SDK/React UI plutôt que le widget. (elevenlabs.io)

Connexion à votre “webservice” (plugins/outils)

Pour exécuter des actions côté navigateur depuis l’agent (ex: rediriger, ouvrir un modal), créez des Client Tools dans l’agent puis enregistrez-les dans votre code; le widget peut déclencher ces outils côté client. (elevenlabs.io)
Pour appeler vos APIs/backs (webhooks, OAuth, tokens, headers), utilisez des Server Tools; l’agent choisira quand les appeler et transmettra les paramètres/réponses. (elevenlabs.io)

Référence rapide

Guide widget (attributs, variant, sécurité, personnalisation): Widget customization. (elevenlabs.io)
Quickstart (snippet d’intégration minimal): Quickstart. (elevenlabs.io)
Intégration (aperçu SDKs, Widget, WebSocket, Twilio/SIP): Integrate overview. (elevenlabs.io)
Outils/“plugins” côté client: Client tools. (elevenlabs.io)
Outils côté serveur (webhooks): Server tools. (elevenlabs.io)

Si vous voyez “un bouton ridicule”, c’est le lanceur par défaut du widget. Passez à variant="expanded" et ajustez l’UI depuis l’onglet Widget ou via les attributs pour obtenir un rendu conforme à votre site. (elevenlabs.io)

Souhaitez-vous un exemple concret adapté à votre stack (React/Next, WordPress, etc.)

#commen integre t on les pluggin des agents dans un site internet ou un webservice - là j'ai essayé