Appearance

Email Subject Line ​

The subject line is the first thing recipients see in their inbox and plays a key role in email open rates. The Email Subject Line feature lets your users define the subject line directly inside the editor, so it is stored alongside the template and can be retrieved programmatically when sending.

Configuration ​

To enable the subject line field, add the following option to your TOPOL_OPTIONS configuration:

ts
enableSubjectLine: true,

Usage ​

Once enabled, a Subject line text field appears in the Settings panel on the right side of the editor, below the preheader text input.

Edit Subject Line

Users can type or edit the subject line at any point during template creation. The value is persisted automatically as part of the template JSON.

INFO

The subject line is metadata only — it is not rendered inside the email body or visible in the email preview. It is intended to be read from the saved JSON and passed to your sending infrastructure.

Retrieving the Subject Line ​

When the template is saved via the onSave callback, the subject line is available in the json parameter:

ts
callbacks: {
  onSave(json, html, mutations) {
    const subject = json.attributes?.["mj-subject"]?.text;
    // → "Your email subject line"
  },
},

The value is stored at json.attributes["mj-subject"].text.

Multilingual Subject Lines ​

When the Multilingual Templates feature is also enabled, each language mutation can have its own subject line. Users can switch to a mutation and edit the subject line in that language - the editor stores a separate value per mutation.

Per-language subject lines are stored inside the langs array in the template JSON, under the translations object with the key "mj-subject":

ts
// json.langs
[
  {
    "key": "en",
    "primary": true,
    "translations": {
      "mj-subject": {
        "content": "Welcome to our newsletter!"
      }
      // ...other translated blocks
    }
  },
  {
    "key": "de",
    "primary": false,
    "translations": {
      "mj-subject": {
        "content": "Willkommen zu unserem Newsletter!"
      }
      // ...other translated blocks
    }
  }
]

To retrieve the subject line for a specific language:

ts
const lang = json.langs.find((l) => l.key === "de");
const localizedSubject = lang?.translations?.["mj-subject"]?.content;
// → "Willkommen zu unserem Newsletter!"

TIP

The base subject at json.attributes["mj-subject"].text always reflects the Primary mutation. Use the langs array when you need the subject in a non-primary language.