Testing your Email Template with Preview Data

Use the Data tab in the Dyspatch Editor to power dynamic email contentDynamic Email ContentText, links, images, and any other email elements that can change, through programming logic, based on the end user. in your template previews. Preview data is formatted as a JSON object, similar to what your system uses when passing data to a template for rendering.

What is JSON?

JSON is a format for representing data with key and value pairs, used to store and exchange data. A JSON key has to be text wrapped in double quotes (e.g. "firstName") and a JSON value can be text, numbers, lists, etc.

An Example JSON Object

Below is an example of a JSON object, with some values: a string "Kieran", a number 2, a list of strings ["sushi","pizza","hash browns"] and a boolean true.

{
  "firstName": "Kieran",  
  "pets": 2, 
  "favFood": ["sushi","pizza","hash browns"], 
  "nicePerson": true 
}

A Template Without Preview Data

A template without preview data

Without preview data, variables will appear in the preview as they are like the @{firstName} above.

Adding Preview Data

Adding in Preview Data

Navigate to the Data tab within the editor to add data for your template. Using JSON format, create your preview data. Variables in your template will now be replaced with the values provided by the data tab.

Preview Data Errors

Preview data error

Incorrect formatting of preview data will cause a warning to appear in your Preview Pane, with a description and location of the error. The error in the example above, means the preview data is missing the colon : required to separate the key from its value.

Where is Preview Data Used?

Preview data is used in the Dyspatch Editor Preview Pane, for Device PreviewsDevice PreviewsView how your email looks when opened in different devices and email clients. and test sending.

The data tab is only for previewing in Dyspatch and will not be used in your live emails.

Next Step: Creating Personalized Templates

By adding robust data to the Data tab, you can thoroughly test your templates before sending and feel good about personalizing your templates with more dynamic content. Learn more about creating personalized content with the visual editor here.