Zephr User Guide

User Variables in Component Templates

14 views 0

As well as defining user variables that relate to your user attributes in the Admin Console, as described in the Add a Component topic, you can also define user variables directly in your template components.

To do this, your template must includes the relevant variables to represent the data to display.

For example, the following template component presets the top variable to {{blaize.user.first-name}}:

An example template used for the Zephr Component Library

Add your template to your Component Library as described in the Add a Component topic.

Note: You do not need to add the {{blaize.user.first-name}} variable when adding this template, as it is preset. You can still add other relevant variables. For example, in the example template above, we added the Title, Body, Button Text, and Button Link variables in the Admin Console, as illustrated below:

Component Library - Example Template Variables

When you create an Outcome using the Component Library, as described in the Add an Outcome topic, you must set the values for these other variables. However, as we preset the {{blaize.user.first-name}} variable, it is already available and you do not need to define a value.

When published, your component template is run through a mustache compiler to replace the variables with your defined content. For example using the template component defined above, the end user’s first name, which is stored as Gwen, displays instead of the {{blaize.user.first-name}} variable as illustrated below:

Example of a Component Library template using a user variable to personalise a banner

By default, mustache variables are HTML escaped. You can use triple mustache syntax to inject rich text without escaping the HTML ASCII characters using the following format:

{{{unescapedVar}}}

For further information on what you can achieve using mustache variables, refer to the Mustache Manual.