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".