Hero, quick links, tabs and accordion
These four blocks shape a page rather than filling it with running text. Use them to give a page a strong top section, a row of link cards, or a way to split a lot of content into named sections without it turning into one long scroll.
Hero
Hero in the Add Block list. A full-width banner with a background image, a heading and optional buttons — the same block used at the top of the homepage.
| Field | What it does |
|---|---|
| Logo | Optional image in the top-left corner |
| Subtitle | Small label above the heading, e.g. "Welcome To The" |
| Title | The large heading. Required |
| Description | A short paragraph next to the heading |
| Buttons | Up to 2 |
| Background Image / Background Video | Full-bleed background. Recommended at least 1920×800 |
The background can be a video instead of an image — set Background Type to Video and add a file under Background Video. If both are set, video wins.
Every page already has its own hero-style header (the page title, driven by the page's own SEO fields) unless you tick Hide Page Hero in the page's sidebar. Add a Hero block instead when you want a bigger, styled banner with a background image — and tick Hide Page Hero so you don't end up with two headers stacked on top of each other.
Quick Links
Quick Links in Add Block. A row of clickable image cards — for the handful of things people come to a page to do, like "Pay Dues" or "Find an Agent".
| Field | What it does |
|---|---|
| Subtitle | Small label above the heading |
| Title | The heading above the cards. Required |
| Cards | 1 to 8 cards |
Each card needs an Image and a Title — both required — plus a link (choose Internal link, Custom URL or File Upload, same three choices as everywhere else in the CMS). Description is the only optional field on a card. A card without a link still saves, but it won't be clickable, so check every card has one before publishing.
Four cards fit per row on a desktop screen; more than four wraps to a second row.
Tabs Section
Tabs Section in Add Block. A set of named panels of rich text. On a wide screen visitors see tabs down the side with the panel next to them; on a phone the same content automatically becomes an accordion instead — you don't configure that switch, it happens on its own.
| Field | What it does |
|---|---|
| Tabs | 1 or more rows |
| Each tab's Title | The tab label. Required |
| Each tab's content | Rich text — headings, lists, tables, images |
Use Tabs Section for a handful of substantial pieces of content where showing them side by side on desktop is worth the extra layout (committee responsibilities, membership benefits by tier, that kind of thing).
Accordion
Accordion in Add Block. A stack of collapsible rows — always a simple expand/collapse list, on every screen size, unlike Tabs Section which only behaves that way on a phone.
| Field | What it does |
|---|---|
| Intro | Optional rich text shown above the rows |
| Rows | 1 or more |
| Each row's Title | Required |
| Each row's content | Rich text. You can also insert a Text Section, Image & Text, a video or a Call to Action inside it |
| Each row's link | Optional — adds a button next to the row's title |
Use Accordion for straightforward question-and-answer or list-style content. It's also the practical stand-in for FAQ content on a page: the CMS has a separate FAQs collection and an "FAQ Section" block meant to display it, but that block does not currently show anything on the site — see Forms, contact and calls to action. An Accordion with one row per question does the same job and actually appears on the page.
Related
- Pages and the page builder
- Editing the homepage
- Text, media and embed blocks