3.3 Adding a Component Variable
Adding a Component Variable
👥 User Journey
User Journey – Adding a Component Variable
📋 Setup
Select a Task
Select Components from the side menu
In the title bar, click the expander arrow button to expand filter options
📘 Steps
1️⃣ Click the pencil icon on the Component to add a Variable to
2️⃣ Type HTML, including the Variable syntax, into the Component Editor
3️⃣ Click the Configure variables button
4️⃣ [optional] Change the Variable type by selecting from the dropdown
5️⃣ [optional] Select the Use default value toggle to enable a default value for the Variable – see setting default values
6️⃣ [optional] Select the Translatable toggle to allow the value to be translated by Translation Jobs
7️⃣ Click Save
:note: Notes
Notice the Variable name field uses the string prefixed by @ from the HTML and is not editable in the Configure variables screen
Component Variables can be one of the following types:
Media ItemNumber (integer)Number (real)PicklistRich TextTextTrue/False
Warnings
Deleting a Variable deletes its Content Items, which can result in data loss if the Task is completed.
Be careful not to accidentally delete Variables in the following ways:
By changing a Variable’s name or type
By cutting and pasting a Variable in the Component Editor
Work around this by using copy and paste instead
The Component cannot be saved if there are errors in the Component Editor, such as with variable naming or syntax
After changing any Variable, the Configure variables screen must be visited before the Component can be saved
💻 Examples
Example of an SEO Component using Variables – a Head Component:
<title>@SEO.Title</title>
<meta name="description" content="@SEO.Description">
<meta name="keywords" content="@SEO.Keywords">
<meta property="og:title" content="@SEO.Title">
<meta property="og:description" content="@SEO.Description">
<meta property="og:image" content="@SEO.SEO_Image.url">