Rich text grid section
The Rich text grid section in Seventh places rich text cards in a row, simple, complex or full width. This page lists its section settings.
Applies to: Seventh 4.0.0 and later. Added in: Seventh 1.0.0. Last checked: 2026-10-12 against Seventh 4.0.0.
The Rich text grid section shows Rich text cards, each combining an image or video with text, one card per row or as a slider. Use it for brand stories, feature explanations and text-only messages on any page. Older Seventh docs call it "Rich text".
Where to find it: select Add section in the theme editor, then choose Rich text: simple, Rich text: complex or Rich text: fullwidth (Add section category Storytelling).
What it shows
- An optional section header.
- Rich text cards. Each card is full width: one card per row in Grid layout, or one card per slide in Slider layout.
- Inside a card you set the media, its position and width, and add Heading, Text, Button, Caption and other blocks. The card settings are in Rich text card.
The section header and the Section design settings are the standard ones, listed in General section styling.
Presets
The three presets differ in their starting card:
- Rich text: simple: one card with media on the left (50 percent wide) and a centered Heading and Text.
- Rich text: complex: one card with media on the right and three Content groups, spread over the card height: a row of two Captions, a Heading with Text, and another row of two Captions.
- Rich text: fullwidth: one card without media, with a centered Caption, Heading, Text and Button. The text is limited to 70 percent of the card width, Extend section width to the edges of the screen is on and Grid gap is None.
Layout
- Layout stacks the cards one per row (Grid) or shows one card per slide (Slider).
- Cards alignment and Grid gap set how the cards line up and the space between them.
How do I show several stories one after another?
Add one Rich text card per story: select the section, select Add block and choose Rich text card. With Layout set to Grid, the cards stack one below the other; set the media of every second card to the other side for an alternating layout. With Layout set to Slider, customers swipe through the cards.
Can I show two Rich text cards side by side?
No. Seventh does not support more than one Rich text card per row in the Rich text grid section. To place text and media cards side by side, use the Custom grid section or the Flexible grid section.
All Rich text grid settings
Every setting in this group, with its type and default.
Accepts these blocks: Rich text card.
Rich text grid section: Layout
Where to find it: Rich text grid → Layout
Layout (dropdown, default: Grid): Sets how the Rich text cards are shown: Grid stacks them one per row, Slider shows one card per slide that customers swipe through. Options: Slider, Grid.
Cards alignment (dropdown, default: Top): Sets how cards of different heights line up. Stretch makes the cards equally tall. Options: Top, Center, Bottom, Stretch.
Stretch alignment type (dropdown, default: Space between): Sets where the blocks sit inside each stretched card. Space between pins the first block to the top and the last block to the bottom. Options: Top, Center, Bottom, Space between, Space around. Shown only when Cards alignment is Stretch.
Grid gap (dropdown, default: Default): Sets the space between the cards. None places the cards edge to edge. Options: None, Default, XXSmall, XSmall, Small, Regular, Large, XLarge, XXLarge.
Rich text grid section: Section header
Where to find it: Rich text grid → Section header
Position (dropdown, default: Top): Sets where the section header sits: Top places it above the cards, Left places it in a column beside them. Options: Top, Left.
Stick to top (checkbox, default: off): Keeps the section header in view while customers scroll through the section, on screens 1024 px wide and larger.
Rich text grid section: Section design
Where to find it: Rich text grid → Section design
The Rich text grid section uses the standard Section design settings, listed in General section styling.
Color scheme (color scheme, default: Scheme 1).
Top padding (dropdown, default: Default). Options: Default, None, Smaller, Larger, Largest.
Bottom padding (dropdown, default: Default). Options: Default, None, Smaller, Larger, Largest.
Extend section width to the edges of the screen (checkbox, default: off). Shown only when Position is Top.
Show media background (checkbox, default: off): Shows a background image or video behind the section content.
Background image (image). Shown only when Show media background is on.
Background image (mobile) (image): Replaces the background image on screens narrower than 768 px. Shown only when Show media background is on and Background image is set.
Background video (video): Plays a muted, looping video behind the section content. When both a video and an image are set, the video is shown. Shown only when Show media background is on.
Media overlay (dropdown, default: Color): Sets the layer over the background media: a flat color or a gradient. Options: Color, Gradient. Shown only when Show media background is on.
Overlay color (color with transparency). Shown only when Show media background is on and Media overlay is Color.
Overlay gradient (gradient, default: linear-gradient(0deg, rgba(0,0,0,0.5) 0%, rgba(0,0,0,0) 100%)). Shown only when Show media background is on and Media overlay is Gradient.
Parallax effect (dropdown, default: Medium): Moves the background media at a different speed than the page while customers scroll. Subtle, Medium and Strong move it by up to 5, 10 and 20 percent. Options: None, Subtle, Medium, Strong. Shown only when Show media background is on.
Push content down (checkbox, default: off): Replaces Top padding with a larger top space, so more of the background media shows above the content. Shown only when Show media background is on.
Make section full height (checkbox, default: off): Makes the section at least as tall as the screen and centers the content vertically.
Related pages
- Rich text card: the card settings, including media position and width.
- General section styling: the Section design settings this section shares with others.
- Content group block: arranges blocks in rows inside a card.