Padding Basics Using the HubSpot Template Builder

Posted by Mariana Morales on June 20, 2017 at 2:12 PM

In HubSpot

You've designed the perfect email template in Photoshop and you've finally finished turning that design into a HubSpot email template. Now you're faced with a few issues, the text seems to be hitting the margins and your white space isn't as prominent as your design intended. You need to add spacing.

The best way to create space in your email is to add spacing in to your HubSpot template.

 

Editing your HubSpot email template

To insert padding, open your template in the design manager. Using the HubSpot template builder modules, click on the gear icon of the module that needs spacing added. Click edit CCS declartions.

You have a coupe of options, first you can add inner spacing, this is padding that is applied inside the module. You want to use this option to create space between the margin and your text.

You can also add outer spacing, this is padding applied around the module. You want to use this option to create white space between modules.

You may want to experiment with the amount of padding you add in order to find the correct spacing. You should preview your settings across different screens, use the preview option to do so.

We explore two reasons why you need to use these spacing options in the below video.

 

Tips for Finding HubSpot Help 

 As you navigate HubSpot's design tools you may come across a number of other questions. Sometimes to perfect your design you will need to add specific css declarations and you may need to have custom modules built to help you achieve your original design. If you're struggling with your HubSpot templates or would just prefer that some build's your templates for you connect with our team below or check out our HubSpot help library here.HubSpot Support from a HubSpot developer