Skip to main content

Using text variables in Alia

Display dynamic content in text elements

Bill Wohlers avatar
Written by Bill Wohlers
Updated over a month ago

You can display dynamic content like discount codes, countdown timers, or even custom Javascript in any text element using text variables.

To add a text variable, select any text element in the popup editor and click "Insert a variable" in the right hand side. You can then select from a number of different options.

SMS consent

Inserts the most up-to-date SMS consent text that is fully compliant with relevant laws, including GDPR. This also includes your company's legal name and Terms/Privacy URLs, which can be configured in settings.

Discount code/expiration

Inserts the discount code or discount expiration countdown. If no discount has been claimed yet (e.g. with a Discount element), nothing will be inserted.

Countdown timer

You can use the countdown() Javascript function within a text element to render a count down clock. Note that there is also a Countdown element, which offers most of the same functionality and is easier to configure.

The countdown() function renders a countdown timer that can count down to 3 different types of date/time targets:

A fixed number of seconds, minutes, or hours

For example, {{ countdown({ hours: 1, mins: 30, secs: 30 }} counts down to 1 hour, 30 mins, and 30 seconds from now (more precisely, when the first timer appears in the popup).

Note that each of these arguments is optional, but at least one of secs, mins, or hours must be provided.

All countdown elements across all steps will start counting at the same time (guaranteeing synchronicity across steps), and will be reset if the page is reloaded.

The end of a period of time

Counts down to the end of the minute, hour, day, week, month, or year.

For example: {{ countdown({ endOf: "hour" }) }}.

A specific date/time

Counts down to a specific date/time (in ISO format). For example, {{ countdown({ date: "2026-01-01T00:00:000Z" }) }} counts down to New Years 2026 (in UTC).

You can also pass a Javascript date object, or a function that returns one. For example: {{ countdown({ date: () => new Date("2026-01-01T00:00:000Z") }) }} will count down until 10 seconds from now.

Custom Javascript

Text variables are inserted in text elements using double curly brackets {{ text_variable }}.

However, anything in double curly braces in a text element is actually interpreted as Javascript. Text variables are simply Javascript variables that are in scope when each JS expression is evaluated.

Therefore, you can write any Javascript expression within curly braces, and the $alia object is in scope. So, for example, {{ $alia.user.profile.properties["My question"] }} would render the user's answer to "My question".

Did this answer your question?