En Tidio, puedes cambiar la posición del widget entre el lado derecho e izquierdo de tu interfaz de administración de Tidio. Si desea mover y mostrar el widget un poco más arriba o más abajo, puede hacerlo aplicando el código CSS personalizado que explicamos en este artículo.
Tenga en cuenta que existen diferentes opciones para diferentes versiones de su widget en Tidio: la versión de escritorio, la versión móvil y la barra lateral.
En este artículo aprenderás:
Posición horizontal (izquierda/derecha)
Puedes cambiar la posición izquierda/derecha del widget de chat en el escritorio yendo a la sección de configuración> chat en vivo> Apariencia en la interfaz de administración de Tidio, donde puedes encontrar la opción de ubicación del widget (dentro de la pestaña Apariencia ):

Consejo: si desea que el widget aparezca en una página determinada solo a ciertas horas del día, puede combinar el cambio de posición con un script JavaScript que verificará la hora y actualizará el CSS en consecuencia.
Posición vertical (alta/baja)
Se requiere la implementación de un código CSS personalizado si desea mover nuestros íconos de chat un poco más arriba o más abajo. Aplicar el código le permitirá mover el widget de chat una cantidad personalizada de espacios.
Si no está seguro de dónde colocar el código o acceder a su código fuente, le recomendamos que se comunique con su desarrollador web para que lo ayude con la implementación.
Cómo utilizar el código CSS
Para mover el widget, agregue el código que se muestra a continuación al encabezado del sitio, justo encima de una etiqueta< /cabeza> el soporte
La primera línea del iframe #tidio-chat activa la ubicación del widget tanto en dispositivos móviles como de escritorio.
La segunda y tercera líneas permiten mover el widget sólo en dispositivos móviles (pasan por alto la primera regla) y también permiten especificar el tamaño de pantalla deseado. Si solo desea mover el widget para dispositivos móviles, cambie solo estas líneas, o mire el código de arriba, si desea mover el chat solo en el escritorio.
El valor de desplazamiento está representado por ‘px’ .
La dirección del movimiento está definida por el primer valor entre paréntesis { }:
top – significa «lejos de la cima»
abajo – significa «lejos del fondo»
izquierda – significa «lejos del lado izquierdo»
derecha – significa «lejos del lado derecho»
Usar un valor de px negativo (por ejemplo, configurarlo en -100px) lo moverá en la dirección opuesta, por lo que si escribe abajo: -100px en el código, el chat se moverá hacia abajo 100px en el sitio.
Un ejemplo práctico: si tienes un banner publicitario en la parte superior del sitio, puedes usar CSS para mover el widget hacia abajo para que no oculte el banner.
Personalización adicional
Además de cambiar la ubicación del widget, existen otras opciones para personalizar el widget de Tidio. Estas opciones incluyen:
- Cambiar colores: puede cambiar los colores del widget para que coincidan con el diseño general de su sitio web.
- Cambio de tamaño: puede cambiar el tamaño del widget para que se ajuste al lugar donde lo coloque.
- Agregar un logotipo: puede agregar su logotipo personal al widget para fortalecer su marca.
- Configuración de mensajes de bienvenida: puede configurar mensajes de bienvenida personalizados que recibirán los usuarios cuando abran el widget.
cambiando colores
Para cambiar los colores del widget, vaya a la sección Configuración> chat en vivo> Se muestra en su interfaz de administración. Allí puedes elegir diferentes colores para el fondo, el texto y los botones del widget.
Cambiar tamaño
Cambiar el tamaño del widget también se realiza en la misma sección. Puede configurar la altura y el ancho del widget para que se ajuste al lugar donde desea colocarlo.
Agregar un logotipo
Para agregar un logotipo, busque la opción para agregar un logotipo en la interfaz de administración de Tidio. Sube tu logo y guarda los cambios.
Configurar mensajes de bienvenida
Para configurar los mensajes de bienvenida, vaya a la sección Configuración> chat en vivo> Notificaciones en su interfaz de administración. Allí podrás agregar mensajes personalizados que serán recibidos por los usuarios.
Resumen
Reposicionar y personalizar el widget de Tidio es un proceso simple que puede mejorar la experiencia del usuario en su sitio web. Siguiendo las instrucciones de este artículo, puede personalizar el widget para adaptarlo a sus necesidades y las de sus usuarios.
Si tiene más preguntas o necesita más ayuda, no dude en ponerse en contacto con el soporte de Tidio o con un desarrollador web profesional.