Get Started with Global Web Templates

The simplest way to develop a Marketing Cloud Personalization web template is to use one of our global templates and customize it for your business use case. To use a global template, do the following.

  1. Clone the global template that most closely represents your web channel use case.
  2. Customize the template to meet the business user requirements.

The following sections present the steps for cloning a global template in Personalization and the best practices for customizing global template code.

For information on the most current list of available global templates and their recommended web channel use cases, see Web Campaign Template Properties on the Salesforce Help site.

To clone a global template, do the following:

  1. Open the Salesforce Interactions SDK Launcher Chrome extension tool, and click the View List section of the template button:

    Launcher View Template List

  2. Click the Global Templates tab to find a list of all currently available global templates.

  3. To clone a global template for customization, click the Clone Global Template button associated with the global template you want to customize.

    Global Templates

  4. Cloning a global template opens a new copy of the template, with the text "[CLONE]" prepended to the template name.

    Cloning and customizing a global template does not alter the original version of the global template in the Global Templates tab. You can make as many clones of a global template as you require for different use cases.

    Clone Global Template

    In global templates, comments are provided at the top of the code tabs to help template developers effectively customize the template. For an example of comments within global templates, see the comments in the Handlebars tab in the above [CLONE] Einstein Product Recommendations figure.

  5. Click Save to save the cloned version of the global template to your dataset. This cloned version appears in the Templates tab along with any other templates you have created or cloned.

    Template List

After you have cloned a global template as described in the preceding section, customize the template components to meet the requirements of the business use case. As a best practice, we recommend you modify the template component code in the following order:

  1. Modify the server-side code in the Serverside Code tab. See Web Template Server TypeScript for more detail.
  2. Modify the client-side code in the Clientside Code tab. See Web Template Client JavaScript for more detail.
  3. Develop the Handlebars templated HTML code in the Handlebars tab. See Web Template Handlebars for more detail.
  4. Develop the CSS style code in the CSS tab. See Web Template CSS for more detail.

When customizing global templates, follow the best practices outlined in the following articles.