Apariencia del widget

Aquí personalizas tu asistente y cómo se ve en tu web: su nombre y sus mensajes, el icono, los colores de tu marca, el tamaño de la ventana y los textos que ve el visitante. Todo se actualiza en tu widget sin tocar una línea de código.

Iconos

Icono del asistente

Es la imagen que aparece en el header del chat y como avatar del bot. Recomendaciones:

• Formato cuadrado 1:1, mínimo 256×256 px (ideal 512×512).
• PNG transparente o con tu color de fondo.
• Máximo 2 MB.

Si no subes ningún icono, se muestra un robot genérico con tu color de marca.

Icono del lanzador

El lanzador es el botón circular flotante que se ve cuando el chat está cerrado. Por defecto usa el mismo icono que el asistente, pero puedes poner otro.

• Límite de 512 KB para la imagen.
• Texto del lanzador: hasta 18 caracteres.
• El color del lanzador se adapta automáticamente a tu color de marca.

Modo del widget

El modo se elige aquí, en Apariencia, y en ningún otro sitio: la vista previa en vivo te enseña cómo queda (a la derecha en pantallas anchas, al final del formulario en las estrechas).

Al guardar, el código de Sitio web → Instalar en tu web se adapta automáticamente al modo elegido: encima del código verás, por ejemplo, «Modo: Popup · cámbialo en Apariencia».

Si ya tienes el código pegado en tu web, el cambio no funciona igual en los dos sentidos:

• De Popup a En línea: el cambio se ve en tu web al momento, sin tocar nada, al final de la página (donde está pegado el código, antes de </body>). Copia el código nuevo y pégalo, dentro de un bloque propio (un bloque HTML o Embed de tu editor, o un <div>), en el sitio de la página donde quieras el asistente; aparece dentro de ese bloque.
• De En línea a Popup: un código En línea ya pegado sigue en línea hasta que lo sustituyas. Cópialo de nuevo y sustituye el anterior.

Tienes los detalles en instalar el widget en tu web.

Posición y tamaño

• Posición del lanzador (solo con Popup): abajo-derecha (por defecto) o abajo-izquierda.
• Tamaño de ventana:

Con En línea solo cuenta la altura: la ventana ocupa todo el ancho del bloque donde pegas el código.

En móvil, la ventana nunca se sale de la pantalla: si el tamaño elegido no cabe, se ajusta a ella.

Colores

• Color primario — el de tu marca. Se aplica al lanzador, el header, los botones y las burbujas del usuario.
• Color de la burbuja del bot — el fondo de los mensajes del asistente.

Los textos se adaptan automáticamente a claro u oscuro según el color de fondo, así que no tienes que preocuparte por el contraste.

Textos

• Nombre del asistente — aparece en la cabecera de la ventana de chat.
• Mensaje de bienvenida — la primera frase que ve el visitante al abrir el chat.
• Mensaje de fallback — lo que responde cuando no encuentra una respuesta en su conocimiento. Consejos para escribirlo en Comportamiento y tono.
• Subtítulo del header — por ejemplo, "Normalmente responde en 2 minutos".
• Placeholder del input — el texto gris dentro de la caja de escritura.

Opciones adicionales

• Mostrar avatar del bot — activa o desactiva el avatar junto a los mensajes.
• Auto-abrir — abre el chat automáticamente. Se configura por separado en escritorio y móvil. Úsalo con cuidado en móvil: puede resultar intrusivo.
• Zona horaria — la usa el asistente para las fechas y las horas (citas, horario de apertura) y el panel de analíticas para las horas punta. Si tu negocio no está en Europe/Madrid, cámbiala.
• Preguntas sugeridas — hasta 4 botones de inicio para guiar al visitante.

La dirección a la que llegan los avisos por email (formularios, reservas, solicitudes de grupo) no está aquí: la configuras en Formularios → Emails de aviso. Más sobre esto en formularios.

Vista previa

• En Apariencia, en todos los planes, tienes una vista previa en vivo que cambia mientras editas.
• En cualquier plan, el botón "Pruébalo" del Resumen abre tu asistente en una pestaña nueva para que lo veas tal cual lo verá un visitante.

¿Quieres que quede perfecto?

Si tienes dudas con los iconos, los colores o el tamaño, abre el Asistente ChatME en el panel y te orienta al momento. Y si prefieres que lo revisemos contigo, reserva una demo.