🦙
Alpaco Developer Documentation
  • Introduction
  • Fundamentals
    • What are the fundamentals
    • Creating an email
  • Template
    • Base
    • Blocks
    • Input Groups
      • Input Types
        • Text String
        • Textarea
        • Select
        • Boolean
        • Image
          • Image settings
        • Color Picker
  • Account settings
    • Integrations
    • Merge Tags
  • How to
    • Validate inputs
    • Subject line & Preheader
    • Escape code from the editor
    • Use custom fonts
Powered by GitBook
On this page
  • Editor
  • How to insert Subject line & Preheader into HTML
  1. How to

Subject line & Preheader

Subject line & preheaders are a natural part of email marketing, it's the first thingbut the way it's handled and supported by the various ESP's are different

PreviousValidate inputsNextEscape code from the editor

Last updated 14 days ago

Arguably one of the most important aspects of email marketing is writing a banger of a subject line and preheader to grab readers attention to even open your email in the first place.

Editor

In the editor users are able to insert both Subject line and preheader for their email. The editor will give indications if the suggested amount of characters have been reached. More advanced ESP's are able to pick up one or both of these fields at export, saving you time to have to do it again.

How to insert Subject line & Preheader into HTML

For some ESP's it's not part of their export options and thus it needs to be either manually inserted when sending out the email, and some of the fetch the information straight from the HTML. In these cases we've made it possible to insert those fields from the editor, so you don't have to create your own. Subject line

<html>
  <head>
    <title>{{subjectline}}</title>
  </head>

Preheader

<div style="display: none !important; padding: 0; height: 1px; font-size: 1px; background-color: inherit !important; opacity: 0; color: transparent; mso-line-height-rule: exactly; line-height: 1px; mso-hide: all">
      {{preheader}}
      <div style="display: none; max-height: 0px; overflow: hidden">
        &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
      </div>
    </div>