Page Builder Widgets — Overview

This chapter documents every block (widget / section / addon) you can add in the Page Builder. Each block has its own page with its purpose, layouts, every field, best practices, examples, and troubleshooting.

Reminder "Widget", "section", "addon" and "block" all mean the same thing in uLanding: a section you drag onto a page.

The widget library

These blocks appear in the Page Builder's widget library:

Note Two extra section types exist for advanced/theme use — About Area and Universal Section — and aren't shown in the default library. They behave like the blocks above but are configured by the theme.

What's the same on every block

Before reading the individual pages, learn the controls that every block shares. The per‑block pages won't repeat these.

Theme Mode (light/dark)

At the top of each block: Inherit / Light / Dark. Forces this block to a color mode regardless of the site setting. See Page Builder → Light & dark mode.

Layout / Variant picker

A row of layout cards. Click one to switch the block's design. Choose this first — it changes which fields appear.

Spacing

• Padding top / Padding bottom — the empty space above and below the block (in pixels or preset classes).

Container width

How wide the content is: normal container, wide, or full‑width — varies per block via a container_width selector.

Background & overlay (where supported)

• Background image / background color — the block's backdrop.
• Overlay color + opacity — a tint over a background image so text stays readable.

Button styling (where supported)

Blocks with buttons let you set: text, URL, background color, text color, hover colors, border, border radius, padding, font and shadow.

Repeaters

Many blocks use repeaters — lists where you click Add to create another item (e.g. counter items, FAQ questions, location cards). Each row can be reordered by dragging, duplicated and deleted.

Icons

Icon fields usually let you choose between: - Icon class (a Font Awesome icon), - SVG (paste custom SVG code), or - Image (upload a small icon image).

Content‑driven vs. self‑contained blocks

Some blocks pull in content you manage elsewhere; others contain their own content.

Tip For content‑driven blocks, the block settings only filter and arrange the content (how many to show, ordering, which category). To change the actual items, edit them in their admin screen (Services, Brands, etc.).

How to read each block page

Each block page has the same structure:

1. Purpose — what it's for and when to use it.
2. Available layouts — every design variant.
3. Field reference — every setting explained.
4. Best practices — pro tips.
5. Example — a concrete setup.
6. Frontend result — what visitors see.
7. Troubleshooting & common mistakes.

Start with the most common block: Hero.