Share Your Work

jehiguese
HubSpot Employee
HubSpot Employee

Drag & Drop Email: How To Use A Custom Footer Module

Hi guys!

 

As you all know, it's currently not possible to update/modify the text of the footer in the drag and drop email editor. You may need to send an email that is translated in another language or you may want to change the spelling of the 'Unsubscribe' or 'Manage preferences' text. 

 

Whatever it may be, you can get around this by creating a custom footer module.

Yes, we can use custom modules in drag and drop email templayes. Essentially, this will contain all the normal footer information (office location and unsubscribe links) along with the custom text that you want.

 

Are you ready? Let's get started!

 

1) Go to the design manager to create a new custom module as mentioned here:

 

Create a new fileCreate a new file

Select 'Module'Select 'Module'

 

Apply & SaveApply & Save

2) Paste the following code in the HTML+HubL box:

<p id="footer" style="font-family: Arial, sans-serif; text-align: center; font-size: 12px; line-height: 1.00em; color: black; display: block;">
{{ site_settings.company_name }}, {{ site_settings.company_street_address_1 }}, {{ site_settings.company_street_address_2 }}, {{ site_settings.company_city }}, {{ site_settings.company_state }} {{ site_settings.company_zip }} {{ site_settings.company_country }} 
<br>
<br>
  <a class="hubspot-mergetag" data-unsubscribe="true" href="{{ unsubscribe_link_all }}" style="text-decoration: underline; whitespace: nowrap; color: #00843D;">Unsubscribe</a> or update your <a class="hubspot-mergetag" data-unsubscribe="true" href="{{ unsubscribe_link }}" style="text-decoration: underline; whitespace: nowrap; color: #00843D;">email preferences</a>
</p>

P.S - You have the option to customize the Hubl tags for the unsubscribe text or email preferences text as mentioned here: https://knowledge.hubspot.com/articles/kcs_article/cos-general/build-a-custom-coded-template-in-hubs...

 

This is what it looks like in the preview:

 

Module previewModule preview

 

Are we good so far? Great!

 

3) Apply your own style (e.g - change the text color) and publish the module.

 

4)  Go to the drag and drop email and swap in your new footer for the default one.

(Note - whenever you create a drag and drop email (there's not a way that we can have it pre-loaded by default).

 

Here is a helpful GIF on how to add it to the email: https://www.loom.com/share/a6b29ce400164cefbaff8ab8815e4652

 

5) Viola! You have your own custom footer module for your drag and drop template.

 

custom email.JPG

0 Réponses

0 Réponses

Aucune réponse publiée pour l'instant

Personne n'a encore répondu à ce post. Revenez plus tard pour voir si une solution a été proposée, ou soumettez votre propre réponse pour aider d'autres utilisateurs.

Répondre à ce post

Si vous avez besoin d'aide pour publier une réponse, consultez la politique d'utilisation de la communauté.