Ajustes
Nuestro widget posee una configuración o ajuste que contiene componentes como colores de cabecera, cuerpo, botones y textos, donde cada uno de ellos se puede configurar por separado.
Por defecto, el comportamiento es obtener el ajuste del widget que hayas configurado en tu cuenta mediante nuestra API.
Recuerda que esta función permite sobre escribir los ajustes y diseños que hayas configurado desde tu cuenta.
Pero también es posible forzar un ajuste propio añadiendo un poco de código en tu sitio web. Para ello deberás tener en cuenta que la estructura es la siguiente:
{
"logo": {
"url": "...",
"height": 180
},
"colors": {
"background": "rgb(255,255, 255, 1)",
"font": "rgb(255,255, 255, 1)",
"gradient": "linear-gradient(to right, rgb(23, 54, 189) 0%, rgb(0, 99, 255) 100%)"
},
"texts": {
"title": "My title",
"subtitle": "My subtitle.",
"segmentsTitle": "Segment title",
"segmentsSubtitle": "Segment subtitle."
},
"settings": { "defaultChannel": "video" },
"orgName": "Company Name",
"services": ["on-demand"]
}
Esta estructura de parámetros te permite modificar logotipo, colores, textos, ajustes y servicios a visibilizar.
Lee a continuación antes de modificar la estructura del ajuste.
url
deberás colocar una URL válida de tu logotipoheight
deberás ingresar el tamaño del logotipo como número (sin unidades)
Es posible en HEX, HSL, pero no es recomendado.
background
deberás ingresar un color en formato RGB.font
deberás ingresar un color en formato RGB.gradient
deberás ingresar un gradiente en formato RGB o un solo color RGB.
Si deseas ocultar un título o subtitulo, simplemente puedes dejarlo como vacío, des decir,
""
.title
deberás ingresar el título de la cabecera del widget.subtitle
deberás ingresar el subtitulo de cabecera del widget.segmentTitle
deberás ingresar el título que estará sobre el listado de segmentos.segmentSubtitle
deberás ingresar el subtitulo que estará sobre el listado de segmentos.
defaultChannel
permite seleccionar valor por defecto entrevideo
oaudio
.
Esta opción solo marcará una opción (micrófono o cámara) por defecto, pero tu cliente podrá igualmente escoger el que desee.
Ingresa el nombre de tu negocio en este campo.
Deberás escoger qué tipos de servicios están activos para tu widget, ya sea entre
on-demand
que representa tus segmentos y schedule
para calendarios. Podrás escoger entre uno u otro.No añadas un servicio al listado si no posees al menos 1 segmento o calendario activo en tu cuenta.
El comportamiento del widget podría ser inesperado.
Luego que haz modificado los parámetros del widget deberás aplicar este cambio añadiendo un poco de código a tu sitio web.
La técnica a utilizar a continuación la puedes aplicar desde Devtools en tu navegador para pre-visualizar el diseño antes de aplicarlo en tu sitio.
const widgetStyle = {...};
window.localStorage.setItem('widget-custom-style', JSON.stringify(widgetStyle));
widgetStyle
corresponde a los parámetros configurados previamente. Si obtienes un error de parsing
verifica que haz escrito correctamente en formato JSON
o como objeto.Refresca tu sitio y verás los cambios.
No modifiques el nombre clave
widget-custom-style
, de esta manera identificamos los parámetros personalizados.Última actualización 19d ago