ElevenAgents en Webflow
Aprende a implementar un agente de ElevenLabs en Webflow
Este tutorial te guiará para añadir tu agente de ElevenLabs Agents a tu sitio web de Webflow.
Requisitos previos
- Un agente de ElevenLabs Agents creado siguiendo esta guía
- Una cuenta de Webflow con el espacio de trabajo Core, Growth, Agency o Freelancer (o un plan de sitio)
- Conocimientos básicos de Designer de Webflow
Guía
Obtén tu código de inserción
Visita el panel de ElevenLabs y busca el widget de inserción de tu agente.
Añade el widget a tu página
- Abre tu proyecto de Webflow en Designer
- Arrastra un elemento Embed a la ubicación que quieras
- Pega el fragmento
<elevenlabs-convai agent-id="YOUR_AGENT_ID"></elevenlabs-convai>en el editor de código del elemento Embed - Guarda y cierra
Añade el script de forma global
- Ve a Configuración del proyecto > Código personalizado
- Pega el fragmento
<script src="https://unpkg.com/@elevenlabs/convai-widget-embed" async type="text/javascript"></script>en la sección Código de pie de página - Guarda los cambios
- Publica tu sitio para ver los cambios
Nota: El widget solo será visible después de publicar tu sitio, no en Designer.
Resolución de problemas
Si el widget no aparece, comprueba lo siguiente:
- El fragmento
<script>está en la sección Código de pie de página - El fragmento
<elevenlabs-convai>está colocado correctamente en un elemento Embed - Has publicado tu sitio después de hacer los cambios
Próximos pasos
Ahora que has añadido tu agente de ElevenLabs a Webflow, puedes:
- Personalizar el widget en el panel de ElevenLabs para que encaje con tu marca
- Añadir más idiomas
- Añadir funciones avanzadas, como herramientas y base de conocimientos