# Personalizar el widget

## Accede al editor de widget

1. Ingresa al [**dashboard**](https://app.videsk.io) con tu cuenta de administrador
2. En el menú principal (lado superior izquierdo), presiona **Integraciones.**

## Edita colores, texto y logo

### Edita colores del widget

Las secciones cuyos colores e pueden editar son: la cabecera del widget y los botones.

![](/files/-Mf3tC4lLWK_kBYArvKU)

#### Cabecera

La cabecera **te permitirá generar una gradiente con dos o más colores**, puedes personalizar la distribución de los colores de la gradiente arrastrando los controladores directamente desde la barra de la gradiente. **Si no deseas utilizar gradiente, debes simplemente dejar dos controladores de color y utilizar el mismo color en ambos.**

#### Botones y burbuja

Los botones de segmentos o departamentos del widget **se pueden definir solamente con un color** y se aplicará a todos los botones de segmentos, sin importar cuántos tengas creados en la actualidad o cuántos vayas a crear en el futuro. **Así mismo, este color se asignará ala burbuja flotante.**

{% hint style="info" %}
Al seleccionar el color de los departamentos también cambiará el color de la burbuja flotante.
{% endhint %}

### Edita logo del widget

![Editando el logo corporativo en el widget](/files/-Mf3yjPJ_7ApjO-LQ0AK)

#### Imagen de logo

Para editar el logo en el widget, debes **pegar una URL de origen de tu logo**, es decir, la url de acceso a tu logo en la **sección URL Logo.**

{% hint style="info" %}
No es posible cargar el logo desde un archivo local de tu computador. Sólo es soportado el logo a través de una URL.
{% endhint %}

#### Tamaño del logo

Puedes editar el tamaño de tu logo utilizando los **controladores de tamaño que se encuentran junto a la línea donde va pegada la url de tu logo**, verás una pequeña celda acompaña de una flecha apuntando hacia arriba y otra hacia abajo. **Haz click en ellas** **para aumentar o reducir** gradualmente el tamaño o **inserta directamente en el campo numérico** el valor que desees asignar.

### Edita textos del widget

También es posible editar los textos del widget de tu cuenta. A continuación se detallan y explican una a una estas estructuras.

![Editando textos del widget](/files/-Mf41uetO1J7qJYbFzMK)

#### Texto del título

Es el texto que viene a continuación del logo, es también el mayor tamaño y generalmente es utilizado para dar la bienvenida, saludo o recepción a los usuarios.

#### Texto del subtítulo

Es el texto pequeño ubicado debajo del título. Este texto generalmente es utilizado para invitar a los usuarios a comunicarse con la empresa, también suelen ser incluidos los horarios de atención.

#### Títulos del segmento

En este campo de texto puede identificar para los usuarios, si la persona se estará comunicando con un área, departamento, equipo etc.

#### Subtítulo de segmentos

Ente campo generalmente seña al usuario que debe hacer click en un botón de segmento, departamento, área, equipo etc... (según defina cada empresa u organización) para poder iniciar la video atención.

#### Filtro de segmentos basado en estado de conexión de agentes

Puedes seleccionar si deseas mostrar los segmentos públicos en tu widget basado en el estado de conexión de los ejecutivos asignados a cada segmento basado en reglas como:

* Todos: Configuración clásica, no se filtra basado en estado de conexión
* Solo conectados: Solo se muestran los segmentos que contienen agentes conectados
* Solo disponibles: Solo se muestran los segmentos que contienen agentes disponibles

{% hint style="warning" %}
Una vez que hayas publicado los cambios, debes editar al menos 1 segmento para purgar la cache.
{% endhint %}

{% embed url="<https://www.loom.com/share/d707c81dd39b4d908dd76ebcfafb87c1>" %}

### Publicar cambios realizados en el widget

Para guardar y publicar los cambios, una vez que hayas legado a un resultado que te guste debes presionar el **botón publicar,** que se encuentra en la **parte superior derecha del editor de widget.**

![](/files/-Mf3tVYeKxIHwj6rVGth)

{% hint style="danger" %}
Deberás presionar en **Publicar**, y los cambios se propagrán automáticamente. De lo contrario perderás los cambios realizados.
{% endhint %}


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.videsk.io/es-dashboard/widget/personalizar-el-widget.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.