Login
Free Sign Up
Docs
/

How to Edit and Group Several Blocks at Once

This guide shows you how to select more than one block in the Experience designer, change their shared styles in one go, and wrap them in a new Box block.

Prerequisites

  • Access to a Space where you can edit Experiences
  • An Experience with at least two blocks

Select Several Blocks

  1. Click a block on the canvas or in the Layers panel.
  2. Hold Shift, ⌘ (macOS) or Ctrl (Windows/Linux) and click more blocks to add them to the selection.
  3. Modifier-click a selected block to remove it from the selection.

A plain click goes back to selecting a single block. The most recently selected block is outlined with a solid border and the rest with a dashed border.

Change Shared Styles

While several blocks are selected, the settings panel lists the selection and shows only the sections that every selected block supports:

Section

Block types

Layout

Box, Button, Link

Size

every type except Text

Spacing

Box, Button, Link, Input, Text, Visualisation

Typography

Box, Button, Link, Input, Text

Border, Background, Visual Effects

Box, Button, Link, Input, Image, Audio, Video

The editors show the values of the most recently selected block. A change is applied to every selected block, and Undo reverts all of them in one step. If a block has a state selected (for example a hover or media state; see Experience States and Print Layout), the change goes into that state's overrides, the same as when you edit the block on its own.

Content and data settings such as text content, Button actions, query, for each, and Entity Context can only be edited one block at a time.

Remove a block from the selection with the × on its tag in the settings panel.

Wrap Blocks in a Box

  1. Select one or more blocks that share the same parent.
  2. Press ⌘ G / Ctrl G, or Shift A, or right-click the canvas and choose Wrap in box.

Result: The blocks move into a new Box block, in their original order, at the position of the first selected block. The new Box block has no padding and becomes the selected block, so you can set its layout straight away.

If the selected blocks have different parents, nothing changes and the Experience designer tells you why. If you also select some of a block's children, only that block is wrapped and its children move with it.

Other Keyboard Shortcuts

Shortcut

Action

Escape

Select the parent block. On the top-level block it clears the selection.

Delete / Backspace

Remove every selected block and select their parent.

Cut, copy and paste work on one block at a time.