Full-width section

This snippet transforms a callout block into a full width section with a colored background as seen below:

Full-width sections

Full-width sections can be useful for breaking up content on the page and giving the page more character.

Works with columns

You can use all Notion blocks including columns inside a full-width section for an interesting layout.

Installation instructions

Step 1: Install the snippet in Super

1. Open your site in the Super Dashboard
2. Open the ‘Code’ page
3. In the ‘Head’ tab, paste the following snippet:
Copy

<link rel="stylesheet" href="https://sites.super.so/snippets/v2/full-width-section.css">

Step 2: Create the content in Notion.

This snippet turns any content that is inside a callout block with a colored background into a full-width section. This will apply to every callout block on your site.

1. Create a callout block on your page in Notion
2. Give the callout block a colored background (doesn’t work on brown)
3. Drag any existing blocks inside the callout or create new blocks inside it
4. Head into Super and refresh your site
5. You can customize the colors in: ‘Design’ > ‘Colors’ > ‘Notion’