GuiasSem código

ElevenAgents no Webflow

Aprenda a implantar um agente da ElevenLabs no Webflow

Este tutorial vai orientar você na adição do seu agente ElevenLabs Agents ao seu site do Webflow.

Pré-requisitos

  • Um agente ElevenLabs Agents criado seguindo este guia
  • Uma conta do Webflow com o Workspace Core, Growth, Agency ou Freelancer (ou um Plano de Site)
  • Familiaridade básica com o Designer do Webflow

Guia

1

Obter seu código de incorporação

Acesse o painel da ElevenLabs e encontre o widget incorporável do seu agente.

<elevenlabs-convai agent-id="YOUR_AGENT_ID"></elevenlabs-convai>
<script src="https://unpkg.com/@elevenlabs/convai-widget-embed" async type="text/javascript"></script>
2

Adicionar o widget à sua página

  1. Abra seu projeto do Webflow no Designer
  2. Arraste um elemento Embed até o local desejado
  3. Cole o snippet <elevenlabs-convai agent-id="YOUR_AGENT_ID"></elevenlabs-convai> no editor de código do elemento Embed
  4. Salve e feche
3

Adicionar o script globalmente

  1. Acesse Configurações do projeto > Código personalizado
  2. Cole o snippet <script src="https://unpkg.com/@elevenlabs/convai-widget-embed" async type="text/javascript"></script> na seção Código do rodapé
  3. Salve as alterações
  4. Publique seu site para visualizar as alterações

Observação: o widget só ficará visível depois que você publicar seu site, não no Designer.

Solução de problemas

Se o widget não estiver aparecendo, verifique se:

  • O snippet <script> está na seção Código do rodapé
  • O snippet <elevenlabs-convai> está posicionado corretamente em um elemento Embed
  • Você publicou seu site após fazer as alterações

Próximas etapas

Agora que você adicionou seu agente da ElevenLabs ao Webflow, pode:

  1. Personalizar o widget no painel da ElevenLabs para combinar com sua marca
  2. Adicionar outros idiomas
  3. Adicionar funcionalidades avançadas, como ferramentas e base de conhecimento