One of our favourite things about the HubSpot marketing platform is that you can create your own templates or you can use a template for their extensive library.
There are many benefits to learning how to make your own templates on HubSpot, chief amoung them, is that you can create a design that is unique to your brand, or brands.
You can design a landing page, email or blog template in your design software of choice, like Photoshop and then slice that PSD file into a template.
Replicating your design to into a HubSpot template
Once you have an approved design from your graphics team member you can start to build your template. First you need to get navigate to the Design Manager, once in the design manager click the blue New template button in the right hand corner, then choose the type of template you'd like to make (email, landing page, web page, blog).
You will have to choose what to name this template and where to save it. In the below video, we walk you through how to slice the content from your PSD file to ensure it is ready to go into your template. We also walk your through the replication process. In this example, we build a newsletter.
Working with HubSpot modules to create your template
HubSpot will provide a default layout, you should at this time remove the modules that you will not need. Your favourite module will become the rich text module, within this module you can build out text, headings and can insert images and html coding.
One thing you should know about the rich text module is that you will need to know how to manipulate the source code in order to make sure the sizing of images etc. meet the size that you need. You may also need CSS for your more complicated design needs, for instance in the above template we use CSS to create a grey border around our email template.
Follow the video to learn how to define your text, and how to use HubSpot's default module to continue to build out your template until publishing.
If you are struggling with perfecting the design when your make your own templates on HubSpot, connect with our Hubspot development team, we can add the coding necessary to help your design vision come to life. To get a quick HubSpot developer quote click here or follow the link below.
