Last updated: October 13, 2020
Rich text modules are flexible content editors that support links, images, code snippets, and more. Your HubSpot blog posts and the main email body of your marketing emails are rich text modules.
The rich text module is also a default module that HubSpot CMS developers can add to a custom coded template. Developers may customize this module to include different options in the page editor.
Please note: rich text modules in starter templates don't support smart content, embedded video, or access to the source code.
When you click a rich text module, a full width toolbar appears at the top of the content editor.
The dropdown menus and icons in the left section of the toolbar control the styling and formatting options of your text.
- To adjust the style, font, or font size applied to your text, click the dropdown menus in the upper left section of the toolbar.
- To apply font styles, adjust text alignment, or to insert a bulleted or numbered list, click the icons across the middle section of the toolbar.
- Click the More dropdown menu to access more formatting options for your font and content, including: strikethrough, superscript, and subscript.
- To add links, images, or emojis in your content, click the icons in the upper right.
- Learn more about how to add a click-to-call or email link.
- Learn how to create new image content with the Canva integration.
- To add video, CTAs, tables, or embed code to your content, click the Insert menu in the upper right. You can also add special characters, horizontal lines, anchors, or non-breaking spaces.
- To personalize your content, click the Personalize dropdown menu and select a personalization token that will populate with values from your visitors' associated CRM records.
- To access the source code of the module, click the Advanced dropdown menu, then select Source code. Since not all HTML is supported in the rich text editor, use a coded module to add complex HTML to your page.
Please note: if you're adding code snippets to a rich text editor using a coding language other than HubL, learn how to wrap the code so it renders properly.
When typing in the editor, pressing Enter or Return on your keyboard creates a paragraph break. Typing Shift + Enter on your keyboard will return your input to a new line below the previous line, without breaking the paragraph or spacing. The editor also supports simple keyboard shortcuts, including copy (Control/Command + C), paste (Control/Command + V), and undo (Control/Command + Z).
After adding content, click an element to see additional formatting options. There's a simple image editor in the rich text module. To resize an image inline, click and drag the blue corner on your selected image. To quickly an image from the editor, click the image to select it and click Remove.
