The idea

Some areas hold a single value — a line of text, an image. A Component Collection holds a list of blocks, and you decide which blocks and in what order. Each block is a component: a hero, a card grid, a callout, a call-to-action strip.

This is what lets one layout produce many different pages. The layout provides the frame; the components provide the content, arranged however that particular page needs.

Adding a component

Inside a collection area, choose to add an element and pick the component type. You then get that component's own fields — because components have areas exactly like layouts do.

Components can nest: a grid component typically contains its own collection of cards. When you are several levels deep it is easy to lose track of which collection you are editing, so save regularly and preview.

Ordering

Components render in the order they appear in the collection, and you can reorder them. Order is stored per element, so moving one block does not disturb the content of the others.

Picking the right component

Two rules of thumb:

  • Prefer an existing component over a close-enough one used oddly. If you find yourself putting a heading into a card's body field to fake a section title, there is probably a section-heading component that does it properly.
  • Prefer the container that already exists. Most component libraries have one general-purpose grid or section wrapper with a setting that switches its arrangement. Use that rather than stacking wrappers.

Global components

Some components are global: defined once and reused across many pages. Editing a global component changes it everywhere it appears — which is the point, but also means a small edit can have a wide blast radius. Use them for things that genuinely should stay identical, such as a contact block or a standard promotional strip.

If a component looks wrong on the page

Check the obvious content causes first: an empty required field, an image that never got picked, text that is much longer than the design anticipated. Genuine rendering bugs are rarer than content that does not fit.