# Variables

Variables are created by users with more technical expertise and allow business users to complete the template without the need for coding. 

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

### **Creating Variables**&#x20;

To create a new variable, click the "New Variable" button. You'll need to enter the name, type, tooltip to display to the business user, and placeholder.&#x20;

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

Variable Types:

* **Text:** Business users can enter text, useful for changing text content within the template.
* **Number:** Business users enter a number, for instance, for sizes in pixels or percentages.
* **Color:** Business users select a color, used for text or border colors.
* **Image:** Business users can change the image URL or upload a new one, used in banners, for example.
* **Options:** Business users can select from a set of options.
* **Product Property:** Product properties like name, price, and custom properties that were added.
* **Product Property Options:** Display product properties for the business user to select from, used for affinity-based recommendations.
* **List:** Define attributes for the list that the business user will complete. For example, for a banner slider, each slide could have an image, text, and button color.

To modify a variable, hover over it and press the icon. Here you can also delete the variable.&#x20;

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

{% hint style="info" %}
The variable will be used in HTML, JS, CSS, and JSON editors using the format **{{VARIABLE NAME}}**.
{% endhint %}

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

**Grouping Variables:** Variable groups allow you to organize and group different variables. For instance, you can have one group for sizes and another for text, making it easier for the business user to find the variable they want to modify. You can create a new group by clicking the "New Group" button and entering the name.

<figure><img src="/files/1DdM6nDv7OrUtgt9T5lh" alt=""><figcaption></figcaption></figure>

When creating or editing the variable, you can select the group it belongs to or drag and drop it into the corresponding group. You can also arrange groups and variables within the group through drag and drop.

### **Completing Variables**&#x20;

As a business user, you can complete or modify variable values according to each type. In the left preview, you can see how the content updates as you modify the variables. You can also see how the content will look on your website even if the variant isn't live yet by clicking "Preview on Site."&#x20;

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


---

# 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://academy.gopersonal.ai/en/admin-ui/personalizations/experiences/variables.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.