Section Component
Text Only
A section for displaying text content with optional CTAs. Essentially a section wrapper for the text partial. Supports lead-in text, titles, subtitles, markdown-formatted prose, and flexible background options.
Section Component
A section for displaying text content with optional CTAs. Essentially a section wrapper for the text partial. Supports lead-in text, titles, subtitles, markdown-formatted prose, and flexible background options.
Introduction
Everything you need to know
This is an example of a text-only section with all text elements populated. Notice how the lead-in text appears above the title, providing context for what follows.
The prose content supports markdown formatting, allowing you to create emphasized text, hyperlinks, and structured content with ease.
This section type is ideal for documentation, blog posts, or any content-heavy pages where text is the primary focus.
With a subtle background color
This text-only section demonstrates how background colors can be used to create visual separation between content blocks. The light gray background helps this section stand out from the surrounding content.
Background options include solid colors or images with optional screening effects for better text readability.
With an image, dark screen and full screen width
This text-only section demonstrates how background images with screens can be used. The screen is used so text above the image has enough contrast to be readable. containerFields.inContainer: false
will render the background accross the whole screen width.
- sectionType: text-only
containerTag: article
# container settings
text:
leadIn: 'Introduction'
title: 'Welcome to Our Platform'
titleTag: 'h2'
subTitle: 'Everything you need to know'
prose: |-
This is an example of a text-only section with all text elements populated.
The prose content supports **markdown formatting**.
ctas:
- url: 'https://example.com/docs'
label: 'Read Documentation'
isButton: true
buttonStyle: 'primary'
Property | Type | Required | Description |
---|---|---|---|
text.leadIn | string | No | Optional introductory text above the title |
text.title | string | No | Main heading text |
text.titleTag | string | No | HTML heading tag (h1-h6) |
text.subTitle | string | No | Optional subtitle below the main title |
text.prose | string | No | Markdown-formatted body content |
ctas | array | No | Optional arrayof call-to-action buttons or links |