Variables hold the state of a page or a whole site: the current tab, a search term, filters, a cart. Bindings read them as vars.name, and workflows change them with Set variable and Reset variable.
Create a variable
Open the Data workspace and add a variable, or press Create variable from a binding. Pick a name (camelCase), a type and a default value. The type is one of string, number, boolean, object or array.
Page or site
- Page variables exist on one page and reset when the visitor leaves it.
- Site variables are shared by every page of the site.
- If both have the same name, the page variable wins on its page.
Persistence
| Persist | Kept in | Good for |
|---|---|---|
none | memory only | UI state like an open menu |
url | the query string | search and filters people can share or bookmark |
local | localStorage | a cart or preferences that survive visits |
session | sessionStorage | state for the current tab only |
json
// A search variable kept in the URL (?search=…)
{ "name": "search", "type": "string", "default": "", "persist": "url" }
// A cart kept in localStorage across visits
{ "name": "cart", "type": "array", "default": [], "persist": "local" }
Nested values
Set a single field inside an object variable with a dotted path, such as filters.category. Inputs can bind two-way to a path too: vars.filters.category.
Next: feed variables into queries so data refetches when they change.