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

• Hero → Spacer → Cards
• Dense Gallery → Spacer → CTA

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:

{
  "size": "sm"
}

Chunk template

Fenom chunk pagebuilder_spacer:

<div class="pb-spacer pb-spacer--{$size ?: 'md'}" aria-hidden="true"{if $id} id="pb-{$id|escape}"{/if}></div>

See also

• Section catalog
• Fields overview
• Frontend output