Variables

Variables are reusable bits of text that automatically fill in with real data when your system runs. They represent dynamic values, like data or attributes pulled from a website (for example, a profile’s name, product title, or page URL).

When you use variables in tags or push prompt configurations, they make your setup more flexible and automated - because you don’t have to manually insert or update values for every case.

How you access Variables in HoodEngage depends on your plan.

For Free, Starter, and Growth plan users, navigate to Site setup > click on the tab Variables.

Variables location for basic users

For Scale and Agency plan users, navigate to Configuration hub > Variables.

Variables location for advanced users

Here, you will get an overview of 2 types of variables:

• System built-in variables: Predefined variables provided by the platform, derived from available data on the current web page, ready for immediate use in your filters.
• User-defined variables: Custom variables enable dynamic values from JavaScript data, events, or page attributes, allowing precise filtering and triggering.

In the top right corner of the system built-in variables section, you have the option to hide/show variables and customize the overview.

Show hide variables

Choose which System variables to display by selecting or unselecting items. Click Confirm to complete the process.

Only user-defined variables can be edited or deleted. To do so, scroll to the right, and click on the pen icon to edit or the bin icon to delete a user-defined variable.

Edit or delete variable

Add new user-defined variable

To add new user-defined variable, click the Add button in the top right corner of the user-defined variables section.

Add new variable

Choose among these user-defined variables.

Choose variable type

URL variable

Use this variable to capture the current page URL or any of its specific components to identify which pages users visit most.

URL variable

Component Type options:

• Full URL – Collects the complete page address.
• Host name – Captures only the domain (e.g., myshop.com).
• Path – Records the page path after the domain (e.g., /products/123).
• Query – Returns URL parameters (e.g., ?utm_source=ad).
• Protocol – Detects the scheme (https or http).
• Port – Shows the server port if present.
• Fragment – Captures the anchor or hash (e.g., #section1).
• Filename Extension – Returns the file suffix (e.g., .html, .pdf).

Referrer

Tracks the previous page or traffic source that brought the visitor to your site.

Referrer variable

Component Type options – identical to URL variable (Full URL, Host name, Path, etc.).

DOM element variable

Captures actions or attributes from specific page elements such as buttons or banners.

DOM element variable

Selection method:

• ID – Select the element by its unique HTML ID.
• CSS Selector – Select using a CSS path (e.g., .btn-primary > span).

Element ID / Attribute Name

Specify which element and which attribute value to capture (for example, href, alt, or value).

Element visibility

• Element Visibility Variable — Check What’s Visible on Screen
• Detects whether a chosen element is visible to the visitor (useful for banner-view or scroll-depth tracking).
• Selection method – Choose ID or CSS Selector to locate the element.
• Output type – Returns True/False or a visibility percentage.
• Minimum percent visible – Sets how much of the element must appear on-screen to count as visible.

1st Party Cookie Variable

Reads a cookie stored on the user’s browser to identify returning visitors or persist user-specific data.

1st-party cookie variable

• Cookie name – Enter the exact cookie key.
• URI-decode cookie – Option to automatically decode URL-encoded values.

Data layer variable

Pulls data from your site’s data layer for analytics, such as transaction IDs or customer info.

Data layer variable

• Data layer name – Name of the key in your dataLayer object.
• Set Default Value – Optional fallback if the key is missing.

Custom JavaScript Variable

Allows execution of your own JavaScript code to return dynamic or calculated values.

Custom JavaScript variable

Custom JavaScript – Add a function that returns the desired value.

Example:

function () {
  return {{url}}.toLowerCase();
}

Custom event

Stores values from events you define manually (e.g., form submit, video play, signup).

Custom event variable

No basic settings required — the variable listens for event names fired through your setup.

Format Value Section — Modify Variable Output

Available for all variable types; lets you clean or standardize the data before use.

• Change Case to… – Convert output to lowercase, uppercase, or title case.
• Convert null to… – Replace null values with custom text or default.
• Change undefined to… – Provide fallback for undefined data.
• Change true to… – Customize how boolean true is displayed (e.g., “Yes”).
• Change false to… – Customize how boolean false is displayed (e.g., “No”).