Module · Features and content
Feature Spotlight
A feature list beside an image, video or chart, with floating cards and app store badges.
Where it is used
- Book a demo page
- Compliance page
- Homepage 1
- Homepage 2
- Analytics product page
- Resource download page
- Professional services solution page
Content settings
What the module says and shows. Repeaters (groups you can add items to) are marked as such.
| Setting | Type | What it does | ||||||||||||||||||||||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| Eyebrow | Text | Short label shown above the heading, such as a category or theme.Default: GO TO MARKET FASTER | ||||||||||||||||||||||||||||||
| Heading | Text | Wrap words in [square brackets] to highlight them, for example: Smarter tools. [Faster growth.]Default: Smarter tools. Faster growth. | ||||||||||||||||||||||||||||||
| Description | Rich text | Supporting text. Keep it to one or two sentences for best results. | ||||||||||||||||||||||||||||||
| Checkmarks List | Text | Short points shown with a check mark. | ||||||||||||||||||||||||||||||
| CTA | Link | Where the button goes. | ||||||||||||||||||||||||||||||
| Button: HubSpot CTA ID | Text | Optional. To use a HubSpot CTA instead of the button (so HubSpot tracks its views and clicks), paste the CTA's ID here. Find it in Marketing > CTAs: open the CTA and copy the number from the page address. Needs HubSpot's CTA tool. Leave empty to use the button. | ||||||||||||||||||||||||||||||
| CTA Text | Text | Text on the button. Leave empty to hide the button.Default: Watch 2-min demo → | ||||||||||||||||||||||||||||||
App store buttonsGroup · 6 settingsButtons to download your app. Each shows only when it has a link.
| ||||||||||||||||||||||||||||||||
| Media Type | Choice | Image: a picture you upload. Video: a thumbnail that plays a video. Analytics chart card: a chart with three figures, built from the fields under Chart card.Options: ImageVideoAnalytics chart cardDefault: Video | ||||||||||||||||||||||||||||||
| Video source | Choice | Where the video comes from.Options: YouTube or Vimeo linkUploaded video (MP4)Default: YouTube or Vimeo link | ||||||||||||||||||||||||||||||
| Video URL (YouTube/Vimeo) | Text | YouTube or Vimeo link. Opens in a pop-up when the play button is clicked. | ||||||||||||||||||||||||||||||
| Video file | File | An MP4 from the file manager, ideally under 50 MB. With no thumbnail, its first frame is shown until it plays. | ||||||||||||||||||||||||||||||
| Video Thumbnail Image | Image | Image shown before the video plays. Leave empty to use the video's own thumbnail (YouTube or Vimeo) or its first frame (uploaded MP4). | ||||||||||||||||||||||||||||||
| Image | Image | Recommended: a PNG, JPG or WebP under 1MB. Add alt text that describes the image. | ||||||||||||||||||||||||||||||
Chart cardGroup · 7 settingsThe figures shown on the analytics chart card. They're illustrative: use your own product's numbers.
| ||||||||||||||||||||||||||||||||
Floating CardsRepeater · 2 settings
| ||||||||||||||||||||||||||||||||
Style settings
In the module's Styles tab: layout, color mode, background, fonts, spacing and animation.
| Setting | Type | What it does | ||||||||||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| Color mode | Choice | "Same as site" follows Theme settings > Color mode.Options: Same as siteLightDarkDefault: Same as site | ||||||||||||||||||
| Eyebrow style | Choice | "Same as theme" follows Theme settings > Eyebrow.Options: Same as themePlain textPillGradient badgeDefault: Same as theme | ||||||||||||||||||
| Highlight color | Color | Color for [bracketed] words in the heading. Leave empty for the theme gradient. | ||||||||||||||||||
FontsGroup · 2 settings
| ||||||||||||||||||||
| Transparent background | On/off | Removes this section's background so the page background shows through. Useful for blending sections together.Default: Off | ||||||||||||||||||
| Background color | Color | Leave empty to use the theme colors for the current light or dark mode. | ||||||||||||||||||
Background effectGroup · 6 settings
| ||||||||||||||||||||
| Background animation | Choice | A subtle moving background behind this section. Soft bubbles: glass circles floating. Aurora: large blurred color clouds drifting. Dot grid: a faint dotted pattern drifting. Ripples: soft rings spreading out. Brand colors only; still for visitors who turn off motion.Options: NoneSoft bubblesAurora glowDrifting dot gridRipplesDefault: None | ||||||||||||||||||
| Animation strength | Number | How visible the background animation is. Lower is subtler.Default: 45 | ||||||||||||||||||
| Number of bubbles | Number | How many bubbles float in this section. Phones show about half of them.Default: 6 | ||||||||||||||||||
| Bubble arrangement | Number | 0: this section gets its own random arrangement. Pick any other number to shuffle the bubbles into a new one, for example if a bubble sits behind your text.Default: 0 | ||||||||||||||||||
SpacingGroup · 4 settingsLeave empty to use the theme section spacing (Theme settings > Layout).
| ||||||||||||||||||||
| Image position | Choice | Where the image sits next to the text.Options: LeftRightBottom (text centered above)Default: Left | ||||||||||||||||||
| Image width (left or right position) | Number | Share of the content width the image takes on desktop. The image stays on its side and grows toward the text.Default: 50 | ||||||||||||||||||
| Image width (bottom position) | Number | Width of the image on desktop. It grows evenly from the center.Default: 100 | ||||||||||||||||||
ImageGroup · 3 settings
| ||||||||||||||||||||
Floating cardsGroup · 3 settingsThe images under Floating Cards on the Content tab.
| ||||||||||||||||||||
| Animate when scrolled into view | On/off | Text rises in line by line and the image slides up as the section comes into view. Visitors who turn off motion on their device see no animation.Default: On | ||||||||||||||||||
Interface labels
Words on buttons and for screen readers. Change them to translate the module.
| Setting | Type | What it does |
|---|---|---|
| Play button | Text | Read by screen readers for the play button.Default: Play video |
| Close button | Text | Read by screen readers for the button that closes the video.Default: Close video |
| Video player | Text | Read by screen readers for the video player.Default: Video |
Tip
Headings support [brackets] to highlight words and | for a new line. See Editing tips.