---
title: "Create or edit an HTML template"
slug: "create-or-edit-an-html-template"
abstract: "How to create and edit reusable HTML templates that format agent outputs for display."
---
# Create or edit an HTML template

HTML templates are configured by admins to define how structured outputs (for example, JSON from schemas) are rendered. Once created, templates can be reused across Agentic studio when [configuring parameters](https://doc.sitecore.com/sai/en/users/sitecoreai/working-with-agentic-studio/understanding-agents/create-a-workflow-agent/create-a-workflow-agent.html#configure-parameters "Configure parameters") in workflow agents to ensure consistent formatting. Admins can update templates at any time.

For more information about HTML templates, see [agent configuration tabs](https://doc.sitecore.com/sai/en/users/sitecoreai/working-with-agentic-studio/understanding-agents/create-a-workflow-agent/overview-of-agent-configuration-tabs.html#html-templates "HTML templates"). 

## Create an HTML template

Admins can create templates to define how agent outputs are displayed.

To create a template:

1. In the navigation menu, click **Agentic** and then, in the left sidebar, select  :mdiCodeTags: **HTML Templates**.
2. On the **HTML Templates** page, click **Add a template**.
3. In the right pane, provide the following:
    - **Name** - the template name. **ID** is generated automatically.
    - **Description** (optional) - what the HTML template is used for.
    - **Tags** (optional) - add labels to categorize the template.
4. Define the HTML structure using schema fields. Use Handlebars syntax to map values from the schema into the template :mdiXml: **Code** editor.

    You can define the template by:

    - Inserting schema fields into the layout, for example, `{{subject_line}}` or `{{body}})`.
    - Structure content using HTML elements, such as `<div>`, `<strong>`, or `<span>`
    - Apply conditional logic or loops, for example `{{#if}}` `{{#each}}` if needed.

    Example

    The following HTML template formats the output of the LinkedIn post schema:

    ```html
    <div class="linkedin-post">
      <div class="headline"><strong>{{headline}}</strong></div>
      <div class="body">{{body}}</div>
      <div class="hashtags">{{#each hashtags}}<span class="hashtag">#{{this}}</span> {{/each}}</div>
      <div class="cta">{{call_to_action}}</div>
      {{#if mentions}}<div class="mentions">{{#each mentions}}<span class="mention">@{{this}}</span> {{/each}}</div>{{/if}}
    </div>
    ```

    This template maps schema fields to HTML elements, repeats hashtags and mentions using loops, and displays the mentions section only when mentions are available.

5. Click :mdiEyeOutline: **Visual** to preview the template.
6. Click **Save**.

## Edit an HTML template

Admins can update an existing HTML template to refine its structure or formatting.

To edit a template:

1.  In the navigation menu, click **Agentic** and then, in the left sidebar, select  :mdiCodeTags: **HTML templates**.
2. On the **HTML Templates** page, click the template you want to edit
3. Update the template as needed.
4. Click **Save**.