The 2:1 Slab creates a two-column layout where the "Main" content occupies two-thirds of the width and the "Aside" content occupies one-third. Unlike other paragraph types that might stack content vertically on smaller screens, the 2:1 Slab is built to maintain its columnar relationship, making it ideal for content that must be viewed in parallel.
Customizable Content Areas
One of the primary differences between this and an Editorial Aside is the flexibility of the Main content area. You are not limited to just a standard body text field; you can select from several different content types:
- Main Content Options: You can choose to populate the larger 2/3 column with standard Body text, a Call to Action, a Link List, Media, or a Pullquote.
- Aside Content Options: The smaller 1/3 column can also be customized with various components, such as a Media Aside or a Call to Action.
Key Features
- Persistent Columns: This paragraph type maintains the column split, ensuring that the aside remains adjacent to the main content rather than moving below it.
- The Flip Toggle: The editor includes a Flip switch. When enabled, this shows the aside content first (on the left) and moves the main content to the right.
- Headline: Like most slabs, you can provide an overall headline that spans the entire width of the component to introduce the section.
How to Configure a 2:1 Slab
- In the Paragraphs section, select Add 2:1 Slab.
- Enter an overall Headline for the section.
- Configure Main Content: Use the dropdown menu to select your desired content type (e.g., Body), then click Add new main content to fill in the details.
- Configure Aside Content: Use the lower dropdown menu to select the aside component (e.g., Media), then click Add new aside.
- Adjust Layout: Use the Flip toggle if you want the smaller aside column to appear on the left instead of the right.
- Click Save to view the parallel column layout on your page.
