La configuración de apariencia en Eddy AI Chatbot te permite personalizar el aspecto del chatbot y dónde aparece en tu sitio web — incluyendo el nombre del chatbot, el icono, el color de fondo, la posición de la pantalla, el espacio y el mensaje de bienvenida. Puedes previsualizar todos los cambios de apariencia en el Playground antes de publicarlos, así que ningún cambio se publica hasta que estés listo.
Cuándo configurar la configuración de apariencia
- Úsalo cuando configures un chatbot por primera vez para que se adapte a la imagen de tu sitio web.
- Úsalo cuando cambie la identidad de tu marca y necesites actualizar el estilo visual del chatbot.
- Utilízalo para ajustar la posición o el espacio del chatbot y que no se solapen con otros elementos de tu web.
- Utilízalo para añadir o actualizar el mensaje de bienvenida que aparece antes de que los usuarios hagan clic en el icono del chatbot.
Antes de que empieces
- Debes haber creado un chatbot de IA Eddy con al menos una fuente conectada.
- Usa el Playground para previsualizar los cambios de apariencia antes de publicar: el Playground refleja todos los ajustes de apariencia guardados sin activarlos rápidamente.
Cómo configurar la configuración de apariencia
- Navega hasta Chatbot de IA (
) en la barra de navegación izquierda y haz clic en Personalizar. - Navega a la pestaña Apariencia ().
- Configura los siguientes ajustes:
Nombre del chatbot
Introduce un nombre en el campo de nombre del chatbot . Este nombre se muestra a los usuarios en la interfaz del chatbot.
Tema de fondo
| Ambientación | Descripción |
|---|---|
| Icono | Sube un icono personalizado para tu chatbot o elige entre las opciones disponibles. |
| Color | Selecciona un color de fondo usando el selector de color, o introduce un código HEX. |
| Posición | Elige dónde aparece el chatbot en la pantalla: izquierda, derecha o abajo. |
| Espaciado lateral | Ajusta la distancia entre el chatbot y el borde izquierdo o derecho de la pantalla. |
| Espaciamiento inferior | Ajusta la distancia entre el chatbot y el borde inferior de la pantalla. |
| Ocultar icono de chatbot | Activa para ocultar el icono del chatbot en la web. El chatbot aún puede activarse de forma programática. |
Mensaje de bienvenida
Activa Mostrar mensaje de bienvenida fuera para mostrar una burbuja de mensaje a los usuarios antes de que hagan clic en el icono del chatbot. Esto ayuda a fomentar la interacción y establece las expectativas del usuario sobre en qué puede ayudar el chatbot.
- Haz clic en Guardar para guardar tus cambios.
- Haz clic en Publicar para que los cambios sean visibles en tu sitio web.
Los cambios de apariencia guardados pero aún no publicados son visibles en el Playground para la vista previa, pero no se reflejan en el chatbot en vivo hasta que haces clic en Publicar.
Mejores prácticas
- Haz coincidir el color del chatbot con el color principal de tu marca : usar el código HEX de tu marca hace que el chatbot se sienta como una parte nativa de tu sitio en lugar de un widget de terceros.
- Usa el mensaje de bienvenida para establecer expectativas — un mensaje de bienvenida como "¡Hola! Pregúntame lo que quieras sobre [nombre del producto]." ayuda a los usuarios a entender qué puede hacer el chatbot antes de escribir una pregunta.
- Previsualiza en el Playground antes de publicar : guarda y revisa siempre los cambios de apariencia en el Playground primero para detectar problemas como recorte de iconos, contraste de color o conflictos de posicionamiento con otros elementos de la página.
- Ajusta el espacio para evitar solapamientos — si tu sitio tiene un banner de cookies, un botón de chat en vivo o un pie de página fijo, aumenta el espacio inferior o lateral para que el chatbot no se solape con esos elementos.