Share on facebook
Share on twitter
Share on linkedin

Trucos CSS para Join.chat

Personaliza el plugin con estilos CSS

Cambia la apariencia de Join.chat añadiendo algunos estilos en la hoja de estilos de tu tema o desde Apariencia > Personalizar > CSS adicional

Puedes combinar varios estilos:

.joinchat {
 --bottom: 80px;
 --btn: 52px;
}

Para aplicar los cambios solo en dispositivos móviles utiliza «media queries»:

@media (max-width: 480px), (orientation: landscape) and (max-width: 767px) {
 .joinchat {
 --bottom: 80px;
 --btn: 52px;
 }
}

👆 Subir el botón flotante

/* defaults: desk 20px, mobile 6px */
.joinchat {
 --bottom: 80px;
}

🤏 Cambiar el tamaño el botón flotante

/* default: 60px */
.joinchat {
 --btn: 50px;
}

☝️ Poner por encima de otros objetos Join.chat

/* default: 1000 */
.joinchat {
 z-index: 99999; 
}

📏 Cambiar la altura de la cabecera de chat

/* defaults: desk 70px, mobile 55px */
.joinchat {
 --header: 60px;
}

🎨 Cambiar el color del botón flotante

/* default: #25d366; */
.joinchat__button {
 background-color: #999;
}

🍪 Utilizamos cookies para mejorar tu experiencia. Visita nuestra Política de Privacidad para saber más.

AL UTILIZAR NUESTRA WEB, ACEPTAS EL USO DE COOKIES.