> ## Documentation Index
> Fetch the complete documentation index at: https://forest-chore-open-api.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# Layout editor

> Customize the appearance and structure of your collections without writing code.

The Layout Editor is Forest's visual customization tool. It lets you control exactly what your operators see and how data is presented, which columns appear in tables, how detail views are organized, and how create/edit forms are structured.

<Info>
  Each environment and team has its own layout. Changes you make in development don't affect production until you deploy them.
</Info>

## Accessing the layout editor

To enter Layout Editor mode, click the **Layout Editor** toggle in the top navigation bar of your back-office. A purple banner appears when the mode is active, any changes you make are saved automatically as a draft.

## Showing and ordering collections

With Layout Editor mode on, you control which collections appear in the navigation and in what order:

* **Show/hide collections**, click the eye icon next to a collection to toggle it. Hide the collections that aren't relevant to your operational team.

<Frame caption="Toggle a collection's visibility with the eye icon">
  <img src="https://mintcdn.com/forest-chore-open-api/TmGmEqoffYUVv4Df/images/master-ui/layout-show-hide-collections.png?fit=max&auto=format&n=TmGmEqoffYUVv4Df&q=85&s=c02416cd764fbfcd501f83e525d7e7af" alt="Show/hide collections with the eye icon" width="1919" height="1080" data-path="images/master-ui/layout-show-hide-collections.png" />
</Frame>

* **Reorder collections**, editable elements are surrounded by dotted lines; drag and drop them to change the order.

<Frame caption="Drag and drop collections to reorder them">
  <img src="https://mintcdn.com/forest-chore-open-api/TmGmEqoffYUVv4Df/images/master-ui/layout-reorder-collections.png?fit=max&auto=format&n=TmGmEqoffYUVv4Df&q=85&s=adfd74d90e53c8412086c4537c1ab100" alt="Reordering collections by drag and drop" width="1920" height="966" data-path="images/master-ui/layout-reorder-collections.png" />
</Frame>

* **Reorder tabs / change the default tab**, by default Forest opens on the Dashboard tab. Drag the tabs (for example move the "Data" tab) to change their order and the default landing tab.

<Frame caption="Reorder tabs to change the default landing tab">
  <img src="https://mintcdn.com/forest-chore-open-api/TmGmEqoffYUVv4Df/images/master-ui/layout-reorder-tabs.gif?s=c1e1625ad1b2e0359ba8dbc0db76aa12" alt="Reordering tabs" width="600" height="312" data-path="images/master-ui/layout-reorder-tabs.gif" />
</Frame>

## Customizing the table view

The table view is what operators see when browsing a collection. In Layout Editor mode:

* **Show/hide columns**, click the eye icon next to any field to toggle its visibility
* **Reorder columns**, drag and drop column headers to rearrange them
* **Resize columns**, drag column borders to adjust width
* **Set default sort**, click a column header to define the default sort order and direction

Changes apply immediately in preview. Other team members continue seeing the previous layout until you publish.

## Customizing the detail view

The detail view shows when an operator opens a single record. Reorganize fields to match your team's workflow:

* **Drag fields** to reorder them on the page
* **Create sections** to group related fields under a heading
* **Add tabs** to separate different areas of information (e.g. "Profile", "Billing", "Activity")
* **Hide fields** that operators don't need to see on this view
* **Configure related data panels**, choose which relationships appear and how they're displayed

### Sections and tabs

Sections help organize long detail views. To add a section:

1. Click **Add section** in the Layout Editor sidebar
2. Give it a label
3. Drag fields into the section

Tabs are useful when a record has many distinct categories of information. Each tab becomes a separate panel in the detail view.

## Summary view

The Summary view is a curated, presentation-oriented view of a single record. Once configured for a collection, it becomes the default entry point when an operator opens one of its records.

To create one, open a record, go to the **Summary** tab and click **Add one** (if a Summary view already exists, reconfigure it from Layout Editor mode).

<Frame caption="Create a Summary view from the Summary tab">
  <img src="https://mintcdn.com/forest-chore-open-api/TmGmEqoffYUVv4Df/images/master-ui/summary-view-add.png?fit=max&auto=format&n=TmGmEqoffYUVv4Df&q=85&s=caeec9bb01877189830f421bc3a5d242" alt="Add a Summary view" width="1920" height="999" data-path="images/master-ui/summary-view-add.png" />
</Frame>

You then build it with a drag-and-drop **visual builder** organized into four categories:

* **Formatting**, add a **Section** and drop fields into it to structure the layout.
* **Fields**, the record's own fields.
* **Related data**, the record's relationships (for example a customer's `Orders`); drag them in like any other module.
* **Actions**, insert any of the collection's [actions](/product/process/actions/overview) directly into a section, so operators can act on the record straight from the Summary.

<Frame caption="The Summary view visual builder">
  <img src="https://mintcdn.com/forest-chore-open-api/TmGmEqoffYUVv4Df/images/master-ui/summary-view-builder.png?fit=max&auto=format&n=TmGmEqoffYUVv4Df&q=85&s=110db2e57c8f1bec61f1b359c9800ac0" alt="Summary view drag-and-drop builder" width="1915" height="899" data-path="images/master-ui/summary-view-builder.png" />
</Frame>

To remove a section or module, drag it from its upper-right corner to the trash icon.

<Frame caption="Insert actions so operators can act on the record from the Summary">
  <img src="https://mintcdn.com/forest-chore-open-api/TmGmEqoffYUVv4Df/images/master-ui/summary-view-actions.png?fit=max&auto=format&n=TmGmEqoffYUVv4Df&q=85&s=698d3678424398d8a6538c63d29223d6" alt="Actions inserted in a Summary view section" width="1920" height="999" data-path="images/master-ui/summary-view-actions.png" />
</Frame>

## Explorer view

The **Explorer** tab lets operators browse linked collections, even across relationships that are several levels deep, and edit, add, or associate records from there.

<Frame caption="Browsing linked collections from the Explorer tab">
  <img src="https://mintcdn.com/forest-chore-open-api/TmGmEqoffYUVv4Df/images/master-ui/explorer-view.png?fit=max&auto=format&n=TmGmEqoffYUVv4Df&q=85&s=67d5c17c23a6d6618cc75cf41264643a" alt="Explorer view browsing related collections" width="1333" height="831" data-path="images/master-ui/explorer-view.png" />
</Frame>

To configure it, turn on Layout Editor mode while on the **Explorer** tab. You choose which related collections to display and up to **3** fields to show for each record.

<Frame caption="Choosing which collections and fields appear in the Explorer">
  <img src="https://mintcdn.com/forest-chore-open-api/TmGmEqoffYUVv4Df/images/master-ui/explorer-view-configure.png?fit=max&auto=format&n=TmGmEqoffYUVv4Df&q=85&s=05bc2b419bc2fe706881e73c675d7928" alt="Configuring the Explorer view in Layout Editor" width="1329" height="833" data-path="images/master-ui/explorer-view-configure.png" />
</Frame>

## Customizing forms

Create and edit forms are configured separately from the detail view, giving you full control over the data entry experience.

In the Layout Editor, switch to **"New record"** or **"Edit record"** view using the selector at the top, then:

* **Reorder fields** to match the natural flow of data entry
* **Group fields** into logical sections (e.g. "Contact info", "Address")
* **Set field visibility**, hide fields that should never appear in forms
* **Mark fields as read-only** in edit mode when they shouldn't be changed after creation

<Warning>
  Hiding a required field from a form will prevent operators from creating records. Make sure required fields remain visible.
</Warning>
