> ## Documentation Index
> Fetch the complete documentation index at: https://docs.instantcampaign.ai/llms.txt
> Use this file to discover all available pages before exploring further.

# Email builder overview

> Find your way around the drag-and-drop email builder, how saving works, version history, approvals and keyboard shortcuts.

The email builder is where you design and edit email templates. You add content blocks to a canvas, style them in a side panel, and preview the result before you send it in a campaign, a journey or a transactional email.

## Open the builder

* **From Templates:** open **Templates** in the sidebar (under **Content**), then open a template from **My Templates**, or click **New Template** to start from a blank one.
* **From the library:** hover a library template and click **Use template**. This makes your own copy and opens it in the builder.
* **From a campaign or journey:** open the template attached to an email step. The back arrow in the builder returns you to where you came from (for example **Back to campaign**).

<Note>
  You need a role that can edit content to use the builder. Anyone without that permission sees a read-only preview of the template instead of the editor.
</Note>

## Builder layout

| Area            | What it holds                                                                                                                                                                  |
| --------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
| **Top toolbar** | Template name, view tabs, preview and test tools, undo/redo, device size, **AMP** toggle, **Save**, **Export**, **AI Tools**, **Version History** and **Deliverability Score** |
| **Left panel**  | The block palette with a **Search blocks** box, the **Snippets Library** button and **Email Layout Settings**                                                                  |
| **Canvas**      | Your email. Click a block to select it, then drag it to move it                                                                                                                |
| **Right panel** | **Styles** (whole-email settings), **Inspect** (the selected block's settings), **Layers** (the block tree) and **Notes**                                                      |

### View tabs

* **Editor**: the editable canvas.
* **Preview**: the rendered email. Use **Desktop** and **Mobile** to change the width. On wide screens, **Split View (Desktop + Mobile)** shows both side by side.
* **Code**: the email as HTML, MJML and JSON. See [Code view and custom HTML](/guides/email-and-templates/code-view).
* **AMP Preview**: only shown when AMP is on. See [AMP email](/guides/email-and-templates/amp-email).

The toolbar also has **Preview as…**, which previews the email for a real contact with sample data, and **Send Test Email**. Both are covered in [Previews and test sends](/guides/email-and-templates/testing-and-previews).

### Focus mode

**Focus Mode (⌘⇧F)** hides the side panels so you can work on the canvas alone. Press **Esc** to leave it.

## Rename a template

Click the template name in the toolbar (**Click to rename**), type the new name and press **Enter**. Press **Esc** to cancel.

## Saving

The builder saves in three ways:

1. **Autosave.** A few seconds after you stop editing, your changes are saved to the template. A dot next to the name shows the state: amber means unsaved changes, grey means saving.
2. **Save.** The **Save** button (or ⌘S / Ctrl+S) saves right away. When nothing is pending, the button reads **Saved**.
3. **Browser draft.** Your browser also keeps a local draft. If you close the tab before a save finishes, you see **Unsaved changes found from … Restore?** the next time you open the template. Click **Restore** to bring the draft back or **Discard** to throw it away. Drafts are kept for 24 hours.

If you try to leave the page with unsaved changes, your browser asks you to confirm.

## Version history

Each save creates a version. Click **Version History** in the toolbar to see them.

<Steps>
  <Step title="Open Version History">
    Click the history icon in the toolbar.
  </Step>

  <Step title="Pick a version">
    Find the version you want and click **Restore**.
  </Step>

  <Step title="Confirm">
    Before it restores, the builder saves your current state as a new version, so you can undo the restore by restoring the latest version.
  </Step>
</Steps>

Up to 20 versions are kept for each template.

## Approvals in team workspaces

In a workspace with more than one member, templates go through a review. The status is shown at the top of the builder: **Draft**, **Pending Review**, **Approved** or **Rejected**.

* **Reviewers** are people whose role has the **Content: approve** permission: Owners and Administrators, and anyone on a custom role that allows it. They can **Approve** a draft or a pending template, or **Reject** it with an optional reason. Pending templates are listed on the **Template Review** page (**Settings → Marketplace → Review**).
* **Everyone else** who can edit templates clicks **Submit for Review**, with an optional note for the reviewer. After a rejection they can **Resubmit for Review**.

**Export**, **Share Link** and **Push to ESP** only work for approved templates in a team workspace. Until then the **Export** menu shows **Approved only**. The check is made by InstantCampaign when the file is created, so it applies to every format (HTML, ZIP, MJML and AMP), to templates written in code, and to the **Command Palette** as well as the menu.

The template's author, and reviewers (who can approve it anyway), can export it before it's approved with **Export HTML** or **Export ZIP** in the **Command Palette**. In a single-person workspace there's no approval step.

Templates saved by a reviewer are approved automatically.

<Note>
  If someone who isn't a reviewer edits an approved template, it goes back to **Draft** and needs approval again. This also turns off its share link and removes it from the Marketplace if it was published. The builder says so next to the status before you edit, and shows a message when your save has sent the template back to **Draft**.
</Note>

## Notes and collaboration

When teammates open the same template, their avatars appear in the toolbar. Use the **Notes** tab to leave a note on a block: select the block, type in **Note on "…"** and click **Add**. Resolved notes are hidden until you click **Show resolved**.

## Command palette and shortcuts

Press ⌘K (Ctrl+K on Windows) to open the **Command Palette**. From there you can insert any block, save, export, send a test, turn AMP on or off, or go to another part of the app.

| Shortcut       | Action                                                                   |
| -------------- | ------------------------------------------------------------------------ |
| ⌘S / Ctrl+S    | Save                                                                     |
| ⌘Z / Ctrl+Z    | Undo                                                                     |
| ⌘⇧Z, or Ctrl+Y | Redo                                                                     |
| ⌘C / ⌘V        | Copy the selected block and paste it (when you're not typing in a field) |
| ⌘⇧F            | Turn Focus Mode on or off                                                |
| Esc            | Leave Focus Mode                                                         |
| ⌘K             | Command Palette                                                          |

## Troubleshooting

<AccordionGroup>
  <Accordion title="The builder says 'Failed to save template'">
    Check your connection and click **Save** again. Your browser draft is kept for 24 hours, so reopening the template offers to restore the unsaved changes.
  </Accordion>

  <Accordion title="Export and Share Link are greyed out">
    In a team workspace, a template must be **Approved** first. Submit it for review, or ask an owner or admin to approve it.
  </Accordion>

  <Accordion title="I can see the template but can't edit it">
    Your role doesn't have permission to edit content. Ask a workspace owner or admin to change your role.
  </Accordion>
</AccordionGroup>

## Related

<CardGroup cols={2}>
  <Card title="Blocks and layout" href="/guides/email-and-templates/blocks-and-layout">
    Every block type, columns, snippets and custom CSS.
  </Card>

  <Card title="Personalization" href="/guides/email-and-templates/personalization">
    Merge tags, Liquid and sample data.
  </Card>
</CardGroup>