Follow these instructions to create a custom module.
Navigate to Design Manager
Navigate to Content > Design Manager.
Create a new custom module
Create a new custom module.
Name custom moduleName and save the custom module. Please note that renaming custom modules will cause content inputed in the editor to be lost. Pages currently using this module will not be updated to reference the new name, and existing content will be lost.
Add fieldsWhen you want to add an editable field for content creators, click add new field.
You can add new fields by clicking +Add new field, or reorder/delete fields by clicking Arrange fields. At this time, custom modules support the following field types:
- Text - A text field can be used to allow your users to insert a string of text in the content editor
- Rich text - Rich text areas give your users all the options available in HubSpot's rich text editor
- Boolean - A boolean field creates a checkbox for users to toggle specific sections of code in your custom module
- Image - The image field adds an image that allows marketers to choose uploaded images from the content editor
- Choice - The choice field creates a dropdown where users can select the value.
Copy and paste snippet
Once you are ready to incorporate one of your custom fields into your code, click copy and paste that snippet into your code (Ctrl V or Cmd V). You can learn more about custom module syntax in this article.
Publish custom module
Press Update to publish your custom module.
Add to template
Finally, you are ready to add your module to any of your landing or site page templates. To add a Custom Module to a template, simply click the gear icon on any module and choose Swap module.
You can then filter by Custom modules. Choose the custom mode that you would like to add, and click Select.