Components

Builder ships with built-in Twig components. You drag them in the visual editor; each has its own settings panel.

Sections and layout

| Component | Notes |
|-----------|--------|
| Section | Generic container; accepts nested elements |
| Header | Layout area (e.g. for Menu) |
| Footer | Layout area |
| Hero | Section preset |
| CTA | Call-to-action preset |
| FAQ | FAQ preset |
| Pricing | Pricing preset |
| Team | Team preset |

Elements

Place these inside a Section or Grid:

| Component | Purpose |
|-----------|---------|
| Grid | Multi-column container |
| Headline | Heading (H1–H6) |
| Text | Body paragraph |
| Image | Image / asset |
| Button | Link button |
| Menu | Navigation links |
| HTML | Raw HTML when needed |
| Craft Field | Display a Craft entry field value |

Working with Grid

1. Add a Grid inside a Section.
2. Set columns in Grid settings.
3. Drop content into each column / grid item.

Menu

Use Menu inside a Header (or Section) to build navigation links (label + URL items).

Craft Field

Use Craft Field when the layout should pull live entry data (title, custom fields, etc.) instead of static text. This is useful for entry-driven pages.

HTML

HTML is an escape hatch for custom markup. Prefer built-in components when possible so styling and structure stay consistent.

Custom components

Developers can register additional components via the Builder SDK or by adding component folders. That is covered in the developer SDK documentation, not this user guide.


Revision #1
Created 23 July 2026 10:33:06 by Comdev_Wiki
Updated 23 July 2026 10:34:50 by Comdev_Wiki