Welcome to Zuora Product Documentation

Explore our rich library of product information

User variables in component templates

This section explains how to use user variables in component templates, including presetting variables and mustache compilation for dynamic content display.

To implement this, your template must incorporate the necessary variables to represent the displayed data.

For instance, consider the following template where the top variable is preset to {{blaize.user.first-name}} :

Screen-Shot-2020-09-02-at-11.45.49-AM.png

Add your template to the Component Library.

Note:

You do not need to add the {{blaize.user.first-name}} variable when adding this template, as it is preset. However, you can still include other pertinent variables. In the example template, we added Title, Body, Button Text, and Button Link variables in the Admin Console.

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.

Upon publication, your component template undergoes mustache compilation to replace variables with defined content. For instance, using the template component mentioned earlier, the end user's first name (e.g., Gwen) is displayed instead of the {{blaize.user.first-name}} variable as illustrated below:

Screen-Shot-2020-09-02-at-11.41.46-AM.png

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 .