Custom Section
A blank, full-width band you fill with your own arrangement of blocks.
The Custom Section block is an empty top-level band that you build yourself. It accepts almost every block on the page, so you can compose a whole stripe of the page — background, heading, media, buttons, a collection, and more — inside one container, then control how that container looks and lays out.
Reach for a Custom Section when none of the ready-made blocks matches the band you have in mind: a hero with a background image and overlaid text, a two-up split of an image beside a call to action, or any custom strip the theme's blocks don't already cover.
What you can put inside
Open the Blocks list inside the Custom Section to add, reorder, or remove its contents, the same way you build the rest of the page. It accepts nearly every block on the page — a sample:
- Heading, Text, and Rich Text
- Button, Button links, and Navigation
- Logo, Media, and Gallery
- Banner, Text & image, Calendar, and Featured
- Group, Carousel, and a Collection
- Opening Hours, Custom Attribute, Sponsors, and a Divider
The one thing you cannot drop inside is another section — neither a Custom Section nor a Reusable Section — so sections never nest inside one another.
Laying out the contents
The Custom Section's arrangement lives on its Layout tab.
Width controls how far the band stretches: Full Width runs edge to edge, Page (default) keeps it within the main page width, Narrow pulls it in tighter, and Custom reveals a slider for an exact width.
Height sets how tall the band is — Auto (default) fits the contents, with Small, Medium, Large, and Full for fixed heights, and Custom reveals a slider for an exact height.
Direction decides whether the contents stack or sit side by side:
- Vertical (default) stacks them top to bottom.
- Horizontal lays them out in a row, left to right.
When Direction is Horizontal, a Vertical on Mobile toggle appears and is on by default, so the row collapses back into a stack on phones.
Alignment lines the contents up along the direction you chose — Left (default), Center, Right, or Space Between. Position lines them up across the other axis — Top (default), Center, Bottom, or Space Between. Gap sets the space between items, from 0 to 120 px in steps of 4. The default is 12 px.
Shared controls
The Custom Section uses the standard block controls for background, borders, spacing, and colour.
- Layout controls — set the band's width, height, direction, and alignment.
- Background and overlay — add a background image or colour, an overlay, borders, and corner rounding.
- Spacing and padding — add padding (including horizontal spacing) and margin around the band.
- Colour scheme in blocks — set the colour scheme for the contents.
- Analytics keys — tag the section for reporting.
Example
A full-bleed hero band with text over a background image:
Add a Custom Section
Add a Custom Section block where you want the band to appear.
Add the contents
Open the section's Blocks list and add a Heading and a Button.
Set the background
On the Appearance tab, add a background image and a dark overlay so the text stays readable (see Background and overlay).
Lay it out
On the Layout tab, set Width to Full Width, set Height to Large, and set Alignment to Center and Position to Center so the heading and button sit in the middle of the band.
Where to go next
Building a page
Add, reorder, and edit blocks — including the contents of a Custom Section.
Group
Cluster a few small blocks into a row or column inside a section.
Reusable Section
Build a section once and reuse it across many pages.
Background and overlay
Give a section a background image, overlay, borders, or rounded corners.