HubSpot's New Design Manager: What Is it and How Can it Help You?
Written by Mayzin Han
21 | 02 | 18
HubSpot recently announced that they're launching an updated Design Manager, which comes with new features and upgrades that are designed for developers who are looking to take a website from prototype to production with ease. But what are these updates and how can they change the way you use HubSpot? Here's a breakdown.
So What's New?
Currently in an open beta and available to all HubSpot partners, major improvements have been made to the Design Manager that allow developers and designers to create custom website templates and modules more efficiently. If you're already doing HubSpot website design, the designer documentation gives a detailed rundown, but the highlights include:
File Management - this new filing system is available in a collapsible sidebar. It allows you to organise your files in any way you see fit by quickly and easily dragging and dropping them from one folder to another.
Layout Editor - HubSpot has defined every area a module can be placed so there is no longer any confusion on how a module will interact with another.
How modules can be cloned in the new Layout Editor. Image credit
You can still drag and drop, but instead of simply dragging a module into a new one, you can now group modules together using traditional keyboard commands and quickly clone them.
Developers have access to 20 new field types and options to change the field's conditions within the page editor, such as making them required, repeatable or uneditable. These new fields come with colour and date pickers and a CTA selector, which allows developers to make it easier for inbound marketers to curate content within HubSpot.
The editor is also now a dark code editor, which makes it easier on the eyes and more aligned with other code editors.
Live Preview - you can now see a live preview of your content while you edit. Previously, you had to open up the preview page and refresh it to see the updates. Now you can open the preview in a new tab/window, make your edits on one monitor and see your changes appearing in real-time on another.
Contextual Menus & Shortcuts - right clicking on an element in the new Design Manager will allow you to access a contextual menu - a feature that replaces the gear icon found on modules in the old design manager. There are also various traditional keyboard shortcuts that are designed to help developers and marketers make quick, simple edits.
Linked Error Console - the new Design Manager now comes with an error console at the bottom of every template so you no longer need to worry about publishing imperfect codes. The console lets you know if there are any errors and exactly where in your code/template they are, along with messages to help developers know precisely what needs to be changed before they can publish.
How To Get More Out of Your Inbound Marketing Efforts
Now that you're up to speed with HubSpot's new Design Manager updates, you can start on improving your inbound marketing strategies. Or maybe you are just learning about the platform and are still considering your options. This free comparison of three leading platforms should help you see where each one succeeds best: