---
title: Email Signature Export Widget
description: Manage email signatures as data and export them into any mail client
date: 2026-06-28
tags:
  - widgets
  - email
  - signatures
---

## What it does

`SignatureExportViewWidget` is a read-only data widget that turns a person's record
into a ready-to-use HTML email signature:

- **Live preview** — the signature is rendered in an isolated iframe.
- **One-click copy** — copies the signature as rich HTML (`text/html`), so formatting
  survives a paste into Gmail, Outlook, Proton Mail and friends.
- **Per-client paste guide** — tabbed step-by-step instructions for New Outlook,
  classic Outlook, Outlook on the web, Gmail, Proton Mail and Apple Mail.

There is no per-customer code: the signature is **data + configuration**. One shared
HTML template is filled per person via the [Text Replacer](../actions/overview.md)
(`#{show firstName}` etc.), so editing the template updates everyone.

## Configuration

Attach it as the **view widget** of a property and pass the shared template:

```ts
"x-type-schema": {
  viewWidget: {
    name: VIEW_WIDGET_SIGNATURE_EXPORT,
    configuration: {
      // omit `template` to use the field value itself as the template
      template: "<table>…#{show firstName} #{show lastName}…</table>"
    }
  }
}
```

The template is rendered against the **whole record** (`rootModel`), so any field on
the person — `firstName`, `lastName`, `jobTitle`, `email`, `phone`, … — is available
as `#{show <field>}`. Unmapped placeholders are stripped, never leaked.

## Set up your team's signatures (backoffice)

1. **People** — add each colleague (e.g. Max, Yannic) as a `Person` record and fill in
   `firstName`, `lastName`, `jobTitle`, `email`, `phone` (plus `phoneTel` in E.164 for
   the `tel:` link).
2. **Signature field** — add a (read-only) property to the Person type, e.g.
   `signature`, and set its view widget to `SignatureExportViewWidget` with the shared
   template (see `BusinessDevelopment/email-signatures/smallstack-signature.template.html`).
3. **Use it** — open a person, switch to the `signature` view, hit **Copy signature**
   and follow the tab for the colleague's mail client.

Editing the template once re-renders every person's signature — no more per-user HTML
files drifting apart.