Wix Smart Chat te permite reflejar el tono y el estilo de tu marca al diseñar y personalizar la interfaz de tu chat. Puedes ajustar los colores, el texto, el estilo y más, directamente en el editor, lo que facilita el uso para los visitantes.
Este toque personalizado puede hacer que se sientan más conectados con tu marca y que sean más propensos a completar su compra. Al alentar a los visitantes del sitio a ponerse en contacto contigo, aumentas la interacción y les prestas un mejor servicio.
Personalizar el estilo del chat
Elige cómo quieres mostrar el chat en tu sitio. Elige en qué lugar de la página aparece y cómo ven los mensajes nuevos los visitantes.
Para personalizar el estilo:
- Ve al editor.
- Haz clic en el widget del chat.
- Haz clic en Ajustes.
- Haz clic en la pestaña Estilo.
- Elige lo que deseas personalizar:
- Posición: decide si quieres que la ventana de chat aparezca en la parte inferior izquierda o en la parte inferior derecha del sitio.
- Ancho y altura: elige el ancho y la altura del chat. Puedes usar los ajustes predeterminados o personalizarlos con el control deslizante.
Configurar los ajustes de texto del chat
Ingresa el texto que deseas que aparezca cuando el chat esté minimizado o sin conexión. Ofrece a los visitantes información por adelantado, como el tiempo de respuesta habitual.
Para configurar los ajustes de texto:
- Ve al editor.
- Haz clic en el widget del chat.
- Haz clic en Ajustes.
- Haz clic en la pestaña Texto.
- Elige qué modo deseas personalizar: Texto de chat con IA o Texto de chat manual.
- Elige lo que deseas personalizar:
- Texto del encabezado: ingresa el nombre que deseas que aparezca en el encabezado cuando la ventana del chat esté abierta.
- Texto de ayuda: establece el texto predeterminado para pedir a los visitantes que ingresen un mensaje (por ejemplo, "Escribe tu mensaje...").
- Cuando el chat está online: ingresa el texto que ven los visitantes del sitio cuando la ventana del chat está disponible para chatear, pero minimizada.
- Cuando el chat está sin conexión: ingresa el texto que ven los visitantes del sitio cuando la ventana del chat no está disponible y está minimizada.
Nota: Esta opción solo está disponible si has seleccionado un estilo de chat minimizado que incluye texto en la pestaña Diseño.
Diseñar el chat
Diseña cada componente del chat en el editor.
Para diseñar el chat:
- Ve al editor.
- Haz clic en el widget del chat.
- Haz clic en Ajustes.
- Haz clic en la pestaña Diseño.
- Elige lo que deseas diseñar:
Personaliza el encabezado de la ventana de chat:
- Los colores del fondo, la fuente y el botón: selecciona un color del tema de tu sitio o elige un color personalizado.
- Fuente: elige un estilo y una fuente en los menús desplegables, y ajusta el tamaño con el control deslizante.
- Mostrar icono de IA: haz clic en la palanca para mostrar u ocultar el icono de IA del encabezado.
Elige cómo quieres que se vea el fondo de la ventana de chat:
- Cambiar colores: selecciona un color del tema de tu sitio o elige un color personalizado.
- Aplicar sombreado: haz clic en la palanca para mostrar u ocultar la sombra. Usa los controles deslizantes para ajustar la opacidad, el desenfoque, el esparcido y la dirección del sombreado.
Elige si deseas diseñar los mensajes de los visitantes, los mensajes de IA o las tarjetas, y personaliza sus elementos:
- Colores: selecciona un color del tema de tu sitio o elige un color personalizado.
- Fuente: elige un estilo y una fuente en los menús desplegables, y ajusta el tamaño con el control deslizante.
- Aplicar sombreado: haz clic en la palanca para mostrar u ocultar una sombra. Usa los controles deslizantes para ajustar la opacidad, el desenfoque, el esparcido y la dirección de las sombras.
- Personalizar los bordes: usa los controles deslizantes para ajustar la opacidad, el ancho y el radio del borde.
Personaliza el aspecto del campo de entrada de texto para los usuarios cuando abren el chat, pasan el cursor sobre el campo o se enfocan (hacen clic) en él:
- Personalizar los bordes: usa los controles deslizantes para ajustar la opacidad, el ancho y el radio del borde.
- Colores: selecciona un color del tema de tu sitio o elige un color personalizado.
- Fuente: elige un estilo y una fuente en los menús desplegables, y ajusta el tamaño con el control deslizante.
Personaliza el aspecto de la ventana de chat cuando está minimizado:
- Burbuja de chat: personaliza el color, la fuente y el sombreado para cuando aparezca un mensaje de chat sobre el botón.
- Botón de chat: personaliza el diseño del botón del chat.
- Diseño: elige un diseño de la ventana de chat:
- Estándar: el chat flota sobre la esquina inferior de tu sitio.
- Pestaña: el chat se adjunta al borde inferior de tu sitio.
- Compacto: el chat solo muestra el icono de IA elegido, sin texto.
- Mostrar: elige un estilo para la ventana de chat cuando está minimizado: Texto e icono, Texto o Icono.
- Color del relleno: selecciona un color del tema de tu sitio o elige un color personalizado.
- Estilo y color de la fuente: elige un estilo y una fuente en los menús desplegables.
- Color del icono: elige un color para el icono (es decir, el botón).
- Icono de botón: elige un estilo de icono entre las opciones disponibles.
- Aplicar sombreado: haz clic en la palanca para mostrar u ocultar una sombra. Usa los controles deslizantes para ajustar la opacidad, el desenfoque, el esparcido y la dirección de las sombras.
- Aplicar animación sutil: haz clic en la palanca para activar una animación que se reproduce cuando el chat del sitio con IA envía un nuevo mensaje mientras la ventana de chat está minimizada.
- Aplicar animación de borde: haz clic en la palanca para habilitar una animación que dirija la atención al chat.
