HubSpot module documentation

Extended Rich Text

Rich text with its own background, a heading level you control, independent alignment for heading, copy and button, and an optional popup carrying a message or a HubSpot form. One module, without a wrapper section.

$29, one time Site pages and landing pages View on the HubSpot Marketplace

Install it

1. Buy and install from the Extended Rich Text listing.
2. In the page editor, drag Extended Rich Text into your layout.

Set up the content

Style it

Alignment

Independent alignment for Header, Content and Button, so a centred heading can sit above left-aligned copy.

Color Settings

Header and Description colours.

Background Settings

• Background Type: colour or image.
• bg_color and bg_image: the background itself.
• Overlay: a wash over the image that keeps text readable. If your copy is hard to read on a photograph, this is the control to use, not a lighter text colour.

Spacing / Padding

• Reset Header Margin removes the theme's default margin above the heading. Turn it on when the gap between the top of the block and the heading looks too large.
• Spacing: padding and margin around the block.

Button Styling and Popup Settings

Label and background colours for default and hover states, and the popup's background, content and confirm button colours.

The button and popup

Under Button in the Content tab: Type (link button or CTA), Label, Link or CTA, and an optional Custom Class Name.

Turn Enable Popup on to have the button open a popup instead of navigating. Then under Popup Content:

• Type: Copy for a message, Form for a HubSpot form.
• Content: Title, Description, an Icon (success, error, warning, info, question) and the Button Text that dismisses it.
• Form Content, Title and Form, Form: the heading above the form, and the form.

Common questions

How is this different from HubSpot's rich text module?

Its own background with an overlay, a heading level you control separately from styling, alignment set independently for heading, copy and button, and a button that can open a form in a popup. HubSpot's rich text module does none of those without a wrapper section and a separate form module.

My heading looks wrong even though I picked h2.

Header Type sets the level in the markup; how it looks comes from your theme's typography. If an h2 is too large, either step to h3 or adjust your theme's heading sizes. Do not pick a lower level purely to make it smaller, because that is what assistive technology reads.

There is too much space above my heading.

Use Styles, Spacing / Padding, Reset Header Margin.

Support