Skip to main content
All CollectionsIntegrationsHubSpot
LaunchNotes Custom Email Template for HubSpot
LaunchNotes Custom Email Template for HubSpot
Adam Wardlow avatar
Written by Adam Wardlow
Updated this week

Create a Custom Email Template in HubSpot

You can take the variables in the LaunchNotes email template

  1. Log in to your HubSpot account.

  2. Navigate to Content > Design Manager.

  3. Click "Create a new file".

  4. Choose "HTML + HubL" file type.

  5. Select "Template" and for the Template Type select "Email". Name your template (e.g., "LaunchNotes Email Template").

  6. In the new file, replace the content with the HTML below.

  7. Optionally edit the template with custom styling and an email footer, then select Publish changes.

<!--
templateType: "email"
isAvailableForNewContent: true
-->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
* { font-family: system-ui !important; }
body { background-color: white !important; margin: 0 auto; }
.tracking-pixel { display: none !important; }
.tracking-pixel img { display: none !important; }
.container { max-width: 588px !important; background-color: #f5f5f5; !important; }
.header_text { background-color: white; font-size: 24px; text-align: center }
.content_head { background-color: white; }
.content_body { background-color: white; }
.footer { border-radius: 0 0 5px 5px }
.footer > p { font-size: 12px; }
.footer > table > tbody > tr > td { padding-top: 0px !important; }
.footer .divider { padding: 10px 0px !important; }
</style>
</head>
<body>
<div class="container" style="margin: 0 auto; padding: 20px;">

<!-- LaunchNotes Content Head -->
<div class="content_head">
{{ custom.content_head }}
</div>

<!-- LaunchNotes Header Text -->
<div class="header_text">
{{ custom.header_text }}
</div>

<!-- LaunchNotes Content Body -->
<div class="content_body">
{{ custom.content_body }}
</div>

</div>

<!-- Footer -->
<div class="footer" style="text-align: center; padding: 20px;">
<p>
{{ site_settings.company_name }}&nbsp;
{{ site_settings.company_street_address_1 }}&nbsp;
{{ site_settings.company_street_address_2 }}&nbsp;
{{ site_settings.company_city }}&nbsp;
{{ site_settings.company_state }}&nbsp;
{{ site_settings.company_zip }}&nbsp;
{{ site_settings.company_country }}&nbsp;
</p>
<p>
You received this email because you are subscribed to {{ subscription_name }} from {{ site_settings.company_name }}.
<br/>
<a class="hubspot-mergetag" data-unsubscribe="true" href="{{ unsubscribe_link }}">Update your email preferences</a> to choose the types of emails you receive.
<br/>
<a class="hubspot-mergetag" data-unsubscribe="true" href="{{ unsubscribe_link_all }}">Unsubscribe from all future emails.</a>
</p>
<br/>
<p>
Powered by <a style="text-decoration:none;color:#707070" href="https://www.launchnotes.com" target="_blank"><b>LaunchNotes</b></a>
</p>
</div>
</body>
</html>

Did this answer your question?