Articles on: The editor

Arrange content in the Build view

Grid mode is in beta and available in selected accounts only.


In the Build view, you arrange a grid scene directly on the page. You select sections, rows, columns and elements on the page, drag sections, rows and elements to move them, and use the toolbar above a selected item to set its width, height and placement.


Selecting content in the Build view


In the Build view, every section, row and column has a grab tab that appears when you hover over it. A section is a row at the top level of the page.


To select a section, row or column:


  1. Hover over it on the page. Its grab tab appears, with the tooltip Select or drag section, Select or drag row or Select or drag column.
  2. Click the grab tab.


Selecting a section by its grab tab in the Build view


To select an element, such as a text or an image, click it.


A selected item shows a toolbar above it. To select the row or section that holds it, click the grab tab of that row or section.


The toolbar above a selected item


In the Build view, a selected item shows a toolbar with the settings that fit that item. Which buttons it shows depends on the item:


  • Section: Width, Height, Align and Row gap, plus style and background.
  • Row inside a section: Height, Align and Row gap.
  • Column: Align and Row gap.
  • Image, video or chart: Height.
  • Text or heading: alignment and Edit text.
  • Button: Content width.


Most items also have Link, Animation and More actions. More actions opens all settings of the item in the settings bar.


The toolbar above a selected section in the Build view


Opening all settings in the settings bar


In the Build view, the full settings of an item open in a settings bar on the right side of the editor, only when you need them.


To open the settings bar:


  1. Select the item.
  2. In the toolbar above it, click More actions.


You can also double-click a section, row or column to open its settings.


The settings bar floats over the page, so the page keeps its size. To keep the bar open beside the page while you work through several items, click the pin (Pin panel — keeps it open beside the page). To close it, click its X or press Esc.


Moving a section or row


To move a section or row to another place on the page:


  1. Hover over the section or row to show its grab tab.
  2. Drag the grab tab to the new spot. A blue drop line shows where it will land.
  3. Release to drop it.


Dragging a section by its grab tab to another place on the page


A red drop line means the section or row can't be placed there.


Moving an element


To move an element, such as a text or an image, to another place on the page:


  1. Click the element to select it.
  2. Drag its drag handle to the new spot. A blue drop line shows where it will land.
  3. Release to drop it.


Dragging a heading by its drag handle into another column


A red drop line means the element can't be placed there.


Moving, copying and deleting a column


In the Build view, you move, copy and delete a column with the buttons beside its grab tab:


  1. Hover over the column and then over its grab tab. Buttons appear beside it.
  2. Click one of them:
    • Move column left or Move column right — swaps the column with the one next to it. When the columns are stacked, the buttons read Move column up and Move column down.
    • Add a copy of this column — adds a copy next to it.
    • Delete column — deletes the column and its content.


Moving a column to the right with the buttons beside its grab tab


You can also drag a column by its grab tab past the column next to it: the two columns swap places, and each keeps its width. A column can't be dragged to another row.


Changing column widths


In the Build view, you change the widths of two columns side by side by dragging the divider between them:


  1. Hover over the gap between two columns. An orange divider appears, with a + at its top.
  2. Drag the divider left or right.


Dragging the divider between two columns to change their widths


Adding a column


To add a column to a row of columns in the Build view, use one of these:


  • Hover over the gap between two columns and click the + that appears. A new, empty column is added in the gap.
  • Hover over a column's grab tab and click Add a copy of this column.


In the Build view, a column can't hold columns of its own.


Setting the width of a section


A section has two widths: how wide the section is on the page, and how wide its content is inside it. A narrower content width keeps text readable while the section and its background still run across the page.


To set the widths of a section:


  1. Select the section by its grab tab.
  2. In the toolbar, click Width.
  3. Under Outer width, choose how wide the section is: Full, Content, Medium or Small.
  4. Under Inner width, choose how wide its content is: S, M, L, XL or Full.


Full runs the section and its background to the edges of the page. Content keeps the section within the page's content area, in line with the rest of the content. Medium and Small make a centered section of about two thirds or half of that width, for example for a quote or a short call to action that stands apart.


Setting the outer and inner width of a section in the Width card


Changing the width of an element or row


In the Build view, you can make an element, or a row with columns, narrower or wider:


  1. Select the element or row.
  2. Drag the handle on its left or right side. The width snaps to the grid columns.


Dragging the side handle of a video to make it narrower in the Build view


Changing the height of an item


To make a section, row, column or element taller, select it and drag the handle on its bottom edge down. A text, heading or button has no height handle: its height follows its content.


For a section, a row or an image, video or chart, you can also choose a height in the toolbar:


  1. Select the item.
  2. In the toolbar, click Height.
  3. Choose Autofit, Fixed, Stretch, Half or Full.


Half and Full make the item half or the full height of the screen, for example for an opening section that fills the screen. Autofit follows the content.


Fixed gives the item a set height; dragging the bottom handle also sets it to Fixed. A section or row with a fixed height still grows when its content needs more room. Stretch makes the item fill the height of the row or column it sits in. On an image or video, Fixed and Stretch fill the height, so its edges can be cut off.


Placing the content of a section


When the content of a section is narrower than the section itself, you choose where the content sits, for example a text on the left side of a section with a background image.


  • Left, centre or right: select the section and click the arrows around its content: Move content left or Move content right.
  • Top, middle or bottom: select the section, click Align in the toolbar and choose Top, Center or Bottom. The arrows Move content up and Move content down do the same on the page.


The arrows around the content of a selected section in the Build view


Deleting content


To delete a section, row, column or element in the Build view:


  1. Right-click it.
  2. Choose Delete element.


You can also select it and press Delete or Backspace. To delete a column, you can also use Delete column beside its grab tab.


Duplicating content


To duplicate a section, row or element in the Build view:


  1. Right-click it.
  2. Choose Duplicate Below.


The copy is added directly below the original. To copy a column, use Add a copy of this column beside its grab tab.


Undoing and redoing changes


To undo your last change, press Cmd+Z (Mac) or Ctrl+Z (Windows). To redo it, press Shift+Cmd+Z (Mac) or Shift+Ctrl+Z (Windows).


Limits of the Build view


The Build view has fewer design options than the Design view. In the Build view:


  • a column can't hold columns of its own
  • a column can only swap places with the column next to it: it can't be dragged to another row
  • column widths can only be changed with the divider between columns
  • the layout type of a row or column can't be changed
  • the page grid and its width can't be changed
  • content can't be dragged on the mobile version
  • content a designer has locked can't be moved or changed


These limits keep the layout set in the Design view intact, so it can't be broken by accident while you work on the content. To make any of these changes, use the Design view. For what each view can do, see Roles and views in the editor.


Frequently asked questions


Why can't I move or change some content?


A designer can lock parts of a page, or limit you to editing certain elements only. In the Build view, locked content can't be moved, deleted or changed. Ask the designer of the page to change the access if you need to edit it.


Why can't I drag a column to another row?


In the Build view, a column can only swap places with the column next to it. Drag its grab tab past that column, or hover over the grab tab and click Move column left or Move column right. To put content in another row, move the elements themselves: sections, rows and elements can be dragged to another place.


Why can't I put columns inside a column?


The Build view doesn't allow columns inside a column: a column holds elements only. In the Design view, a column can hold a row with columns of its own. See Rows, columns and elements.


Where is the right panel?


The Build view has no panel that is always open. Settings appear in the toolbar above a selected item, and all settings open in the settings bar when you click More actions.


How do I change the background of a section?


Select the section by its grab tab and click the background button in the toolbar above it. See Backgrounds in a grid scene.


Why can't I drag content on the mobile version?


In the Build view, content can't be dragged on the mobile version. You change the order of content on mobile with the structure rail beside the mobile canvas. See Edit the mobile version of a grid scene.

Updated on: 03/11/2026