Marketing Blocks
Reference for the 4 marketing category blocks: Hero, Hero (Presentation), Feature Grid, and Call to Action. These blocks bring marketing home page section types into regular content pages.
The Marketing category includes 4 blocks for creating visually engaging landing pages and promotional content within regular documentation pages. These blocks mirror the marketing home page section types but render within the page's content container with rounded corners.
Hero Block
Full-width hero section with background image, text overlay, title/subtitle, and an optional call-to-action button. Ideal for page headers and landing page introductions.
| Property | Type | Description |
|---|---|---|
| title | string | Main hero heading (required) |
| subtitle | string | Supporting text below the title |
| backgroundImage | StoredImageValue | Background image uploaded to the page assets directory |
| overlayEnabled | boolean | Enable a colour overlay on the background image |
| overlayColor | string | Overlay colour (default: #000000) |
| overlayOpacity | number | Overlay opacity percentage (default: 50) |
| textColor | string | Text colour for title and subtitle (default: #ffffff) |
| textAlignment | string | Text alignment: left, center, or right (default: center) |
| minHeight | string | Minimum section height as CSS value (default: 60vh) |
| ctaEnabled | boolean | Show a call-to-action button |
| ctaText | string | Button label text |
| ctaType | string | Link type: home, page, external, or form |
| ctaPageId | string | Target page ID when ctaType is page |
| ctaExternalUrl | string | Target URL when ctaType is external |
| ctaFormId | string | Target form ID when ctaType is form |
| ctaButtonColor | string | Button background colour (default: #3b82f6) |
| ctaButtonTextColor | string | Button text colour (default: #ffffff) |
Hero (Presentation) Block
Hero section with an animated presentation diagram as the background instead of a static image. The diagram plays automatically in a loop behind the overlay and text content.
| Property | Type | Description |
|---|---|---|
| title | string | Main hero heading (required) |
| subtitle | string | Supporting text below the title |
| diagramId | string | Presentation diagram file selected from the workspace |
| overlayEnabled | boolean | Enable a colour overlay on the diagram background |
| overlayColor | string | Overlay colour (default: #000000) |
| overlayOpacity | number | Overlay opacity percentage (default: 30) |
| textColor | string | Text colour for title and subtitle (default: #ffffff) |
| textAlignment | string | Text alignment: left, center, or right (default: center) |
| minHeight | string | Minimum section height as CSS value (default: 60vh) |
| ctaEnabled | boolean | Show a call-to-action button |
| ctaText | string | Button label text |
| ctaType | string | Link type: home, page, external, or form |
| ctaPageId | string | Target page ID when ctaType is page |
| ctaExternalUrl | string | Target URL when ctaType is external |
| ctaFormId | string | Target form ID when ctaType is form |
| ctaButtonColor | string | Button background colour (default: #3b82f6) |
| ctaButtonTextColor | string | Button text colour (default: #ffffff) |
Feature Grid Block
A configurable grid of feature items, each with an icon, title, and description. Supports 2, 3, or 4 column layouts with optional section header.
| Property | Type | Description |
|---|---|---|
| sectionTitle | string | Optional heading above the grid |
| sectionTitleColor | string | Title colour |
| sectionSubtitle | string | Optional subtitle below the heading |
| sectionSubtitleColor | string | Subtitle colour |
| columns | number | Number of columns: 2, 3, or 4 (default: 3) |
| backgroundColor | string | Section background colour (default: transparent) |
| textColor | string | Default text colour for items |
| items | array | Array of feature items (see below) |
| Property | Type | Description |
|---|---|---|
| icon | string | Icon name from Lucide, Heroicons, or Bootstrap libraries |
| iconColor | string | Icon colour |
| iconBackgroundColor | string | Icon circle background colour |
| title | string | Feature title |
| titleColor | string | Title colour override |
| description | string | Feature description text |
| descriptionColor | string | Description colour override |
| order | number | Display order within the grid |
Call to Action Block
A conversion-focused section with a title, supporting text, and up to 2 configurable buttons. Each button can link to an internal page, external URL, the home page, or a form.
| Property | Type | Description |
|---|---|---|
| title | string | Section heading (required) |
| titleColor | string | Title colour override |
| supportingText | string | Descriptive text below the title |
| supportingTextColor | string | Supporting text colour override |
| backgroundColor | string | Section background colour (default: #1f2937) |
| textColor | string | Default text colour (default: #ffffff) |
| buttons | array | Array of 1-2 button objects (see below) |
| Property | Type | Description |
|---|---|---|
| text | string | Button label |
| style | string | Button style: primary or secondary |
| type | string | Link type: home, page, external, or form |
| pageId | string | Target page ID when type is page |
| externalUrl | string | Target URL when type is external |
| formId | string | Target form ID when type is form |
| buttonColor | string | Button background colour |
| buttonTextColor | string | Button text colour |
Recommended Usage Patterns
Complete reference for all content block types in Content Foundry. Blocks organised into categories covering documentation, diagrams, charts, decisions, risk, APIs, testing, operations, and marketing.