PageBuilder
Visual section builder for MODX 3. Draft and publish without overwriting resource content
Spacer
An empty section with fixed height. Use it when neighboring blocks feel cramped.
Why an empty section
- Page rhythm without empty divs in templates
- Four heights out of the box (
sm–xl) - Section order stays clean when editors change content
Where it helps
- After hero: separate the first screen from body content
- After a dense grid of cards or gallery
- Before footer: space after the last CTA
Page examples
Choosing size
Pick Size (sm, md, lg, xl). No other fields.
Similar sections
- Theme CSS spacing for site-wide pixel control
- Rich text if you need copy between blocks
Block parameters
| Parameter | Value |
|---|---|
| key | spacer |
| Layer | Free |
| Category | layout (layout) |
| Chunk | pagebuilder_spacer |
| Requires | — |
Inspector fields
Fill these fields in the section inspector. Field types are documented in the field types reference.
Size (size)
Type select. Required. Dropdown with predefined options.
Site output
pb-spacer with a size modifier.
Section data
Example payload after save. Media, video, and map values may be enriched on output:
json
{
"size": "sm"
}Chunk template
Fenom chunk pagebuilder_spacer:
fenom
<div class="pb-spacer pb-spacer--{$size ?: 'md'}" aria-hidden="true"{if $id} id="pb-{$id|escape}"{/if}></div>JSON definition
core/components/pagebuilder/sections/spacer.json