> For the complete documentation index, see [llms.txt](https://academy.gopersonal.ai/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://academy.gopersonal.ai/guia-de-usuario/personalizaciones/experiencias/variantes/variables.md).

# Variables

Las variables son fundamentales en el proceso de personalización, ya que permiten realizar ajustes rápidos y sencillos en las variantes sin necesidad de conocimientos técnicos avanzados. Facilitan la modificación del contenido de manera eficiente, lo que optimiza el tiempo y asegura que las variantes se adapten de manera precisa a las necesidades del negocio.

Las variables son creadas por usuarios con mayor experiencia técnica y permiten que los usuarios de negocio completen el template sin necesidad de codificación, haciendo el proceso de personalización más accesible y eficiente.

<figure><img src="/files/D1vwKXeQ6s4qS3WGFQOD" alt=""><figcaption></figcaption></figure>

## Creación de Variables

Para crear una nueva variable, se debe hacer clic en el botón "Nueva Variable". A continuación, se requiere ingresar el nombre, tipo, tooltip, placeholder y el grupo al que corresponde.

<figure><img src="/files/KLWjvkOqy17ypREtM5CB" alt="" width="375"><figcaption></figcaption></figure>

**Tipos de Variables:**

* **Texto:** Los usuarios de negocio pueden ingresar texto, útil para modificar el contenido textual dentro del template.
* **Número:** Los usuarios de negocio ingresan un número, por ejemplo, para definir tamaños en píxeles o porcentajes.
* **Color:** Los usuarios de negocio seleccionan un color, utilizado para el texto o los bordes.
* **Imagen:** Los usuarios de negocio pueden cambiar la URL de una imagen o subir una nueva, utilizada en banners, por ejemplo.
* **Opciones:** Los usuarios de negocio seleccionan de un conjunto de opciones predefinidas.
* **Propiedad del Producto:** Propiedades del producto como nombre, precio y propiedades personalizadas que se han añadido.
* **Opciones de Propiedad del Producto:** Muestra las propiedades del producto para que el usuario de negocio seleccione, utilizado para recomendaciones basadas en afinidad.
* **Listado:** Define los atributos para la lista que el usuario de negocio completará. Por ejemplo, para un slider de banners, cada diapositiva podría tener una imagen, texto y color de botón.
* **Fuente de texto:** Seleccionar del listado de fuentes disponibles.
* **Fecha**: Usuarios de negocio ingresan fecha.
* **Fecha y Hora:** Usuarios de negocio selecciona fecha y hora.
* **Video Shopping:** Usuario de negocio selecciona un video creado en la sección video shopping.
* **Textarea:** Usuario de negocio completan textos de varias líneas.

Estos datos son luego presentados al usuario de negocio para que los complete.

{% hint style="info" %}
Las variables se agregan en el código como **{{VARIABLE NAME}}**.
{% endhint %}

<figure><img src="/files/Euy1DiDYgUDWLxJlolsL" alt="" width="563"><figcaption></figcaption></figure>

## Modificar Variable

Es posible modificar una variable haciendo clic en el icono <img src="/files/MIDCm9SDHKSYaJRVF9rn" alt="" data-size="line">. También se puede eliminar la variable desde esta opción.

<figure><img src="/files/dtjIlJJOXxBJhUX7FAJ3" alt="" width="355"><figcaption></figcaption></figure>

## Grupo de Variables

Los grupos de variables permiten organizar y agrupar diferentes variables, facilitando la búsqueda y modificación por parte del usuario. Por ejemplo, se puede tener un grupo para tamaños y otro para textos. Para crear un nuevo grupo hacer click en el botón "Nuevo Grupo" e ingresando el nombre del grupo.

<figure><img src="/files/6UxJp57CJWH8nHsIG256" alt=""><figcaption></figcaption></figure>

## Completar Variables

Como usuario de negocio, se puede completar o modificar los valores de las variables de acuerdo con cada tipo. En la vista previa a la izquierda, se puede observar cómo se actualiza el contenido a medida que se modifican las variables.

<figure><img src="/files/SzT6kQ8QgNMqynkE7owK" alt=""><figcaption></figcaption></figure>
