> ## Documentation Index
> Fetch the complete documentation index at: https://docs.elementum.io/llms.txt
> Use this file to discover all available pages before exploring further.
# Layout Builder
> Design, organize, and manage workflow data and features with layouts
# Layouts: Building Your Workflow UI
Elementum layouts let you visually design how users interact with workflow data and features. Layouts combine **Fields** (your workflow's state/data) and **Components** (Elementum-powered workflow features) into clear, actionable interfaces.
## Access the Layouts Builder
Once you click Create on a new object, you are automatically redirected to the Record Details Layout.
To make edits later, open your app, element, or task. Click **Record Details Layout** under **User Interface** in the left navigation menu.
Changes in the record details layout are saved automatically. You may need to refresh to see the updates in your object records.
## Manage Workflow Stages
At the top of the Record Details Layout, manage the Workflow Stages by clicking the **+** button to add more or the **Edit** icon next to a stage to rename.
Click the **Delete** icon next to a stage to remove it. This is only available if you have multiple stages.
To reorder your stages, click the stage circle and drag to the desired order.
Each stage can have its own layout and fields. Click on the stage at the top of the page to arrange the layout.
**Bring AI into your workflow UI**
Admins can add an **Agent Button** (star icon) to any section of the layout. This lets users access an AI Agent designed to provide insights, suggestions, or actions tailored to that part of the workflow.
1. Toggle the star icon to enable Elementum Intelligence for a section
2. Select or create an Agent to assist users with context-specific help
3. Configure the Agent to match the needs of each workflow stage or section
[**Learn how to build and configure agents**](/ai-agents/agents-experience) and [**configure agent tools, channels, and integrations**](/ai-agents/agents-tools-and-deployment).
## Fields and Components
Click the **+** icon in a section or in the right panel to create and add Fields and Components. If you create the item in the panel, you'll still need to drag it to your layout to see it in record details.
To add a section, hover over the break in the field and click **+ Section**.
Sections group fields and components for clarity (e.g., "Header", "Invoice Data").
All items can be dragged to a new location in your layout. Click the **Delete** icon next to any item to remove it from your layout.
Field types can be reused in a stage. Components cannot.
If the item pulls in a list of data from a table or object, adjust the Display settings within the editor to apply to all future record details views.
## Fields: Your Workflow State
Fields are the core data elements of your workflow. When you add a field, you're defining a piece of state that's dynamically stored in your database. Fields are reusable and can be organized into sections.
### Field Types
| Type | Description |
| ----------------- | -------------------------------------- |
| Automation Button | Run automations directly from a record |
| Calculation | Computed fields |
| Checkbox | Boolean (true/false) |
| Create Button | Action triggers |
| Date | Date only |
| Date Time | Date and time |
| Decimal | Numeric values with decimals |
| Dropdown | Predefined selection options |
| File | File upload field (250MB max per file) |
| Groups | Assign teams |
| JSON Field | Structured data |
| Multi-Select | Multiple choice selections |
| Number | Numeric input |
| QR Code | Generate and display QR codes |
| Relate Button | Create relationships |
| Related Items | Linked records |
| Rich Text | Formatted content, descriptions |
| Text | Basic string input |
| User | Assign individuals |
**Number vs Decimal**: Choose based on whether fractional precision matters.
* **Number** rounds a fractional value down to a whole number. Use Number for counts, quantities, or IDs where whole values are all that make sense.
* **Decimal** preserves fractional precision. Use Decimal anywhere fractional precision matters — currency with cents, percentages, ratios, or scores.
When building automations that move data between the two, map Number → Decimal, not the reverse. Going the other direction loses precision, so budget time for a TEXT/VALUE workaround if you need it.
**File Fields vs Attachments Component**: File fields are specific fields on a record for storing a single file (like "Invoice File" or "Contract Document"), while the Attachments component provides a general-purpose area for multiple file uploads. Both support files up to 250MB.
**Rich Text Fields**: Rich Text fields render both HTML and Markdown. To insert code, click the **Insert Quote** icon in the editor toolbar.
### Dependent (cascading) dropdowns
A **Dynamic** dropdown populates its options from the records of another Object. To make a child dropdown show only options that match a parent field's value (for example, filtering State/Province by the selected Country):
1. Create and save the child Dynamic dropdown first, choosing its **source Object**. The relationship setting appears only when editing an existing field, and the source Object is locked once set.
2. Reopen the field (**Admin** > your app > the field) and enable **Configure Relationships**.
3. Choose the **parent field**, then map it to the matching field on the child's source Object. This mapping filters the child's options by the parent's selected value.
The filter field cannot be a JSON field, a Dynamic child cannot sit under a Stage-type parent, and a static child requires a static parent. To source options from an external API instead of an Object, see [Populate Dropdown Fields from External APIs](/workflows/api-powered-dropdowns).
Two separate dropdowns that share one option list cannot hide a value in the second field once it is picked in the first — option-level exclusion between peer fields is not supported. To let users pick two different values, use a single **Multi-Select** field; to keep two separate fields, add a conditional rule that flags the record when both hold the same value.
### Field Options
When adding many of the fields, the following toggles are available:
| Toggle | Description |
| ----------------- | ---------------------------------------------------------------- |
| Required | Must be filled out on creation |
| Required on close | Must be filled out for the record to be placed in a close status |
| Show on Create | Appears when the Create button is used to add a record |
| Locked on Create | Cannot be edited after creation |
| Full width | Spreads across the entire section rather than the automatic size |
Fields added to a record details layout can be used for filtering and search in the object views.
### Mark statuses as closed
A **Status** field is a Dropdown field whose **Treat this field as** setting is **Status**. You can mark more than one option in a Status dropdown as closed — for example `Closed-Good`, `Closed-Bad`, `Canceled`, and `Complete` — instead of being limited to a single closed status. Every value marked as closed shows the same closed indicator and is recognized as closed across reports, filters, dashboards, and automations.
App Administrators configure closed statuses from the Record Details Layout:
1. Open **App** → **User Interface** → **Record Details Layout**.
2. Click the **Status** field to open the **Edit Dropdown Field** editor.
3. In the **Static Dropdown** panel on the right, click the **Edit** icon next to a status value.
4. Toggle on **Mark as Closed** to treat that value as a closed status.
5. Repeat steps 3–4 for each additional status value that should be recognized as closed.
6. Click **Save**.
The same steps apply to any static Dropdown field where **Treat this field as** is set to **Status**, not only the system-required Status field.
***
## Components: Elementum Workflow Features
Components are first-class, pre-built workflow modules managed by Elementum. Unlike fields, components are not just data—they provide interactive features and logic.
### Common Components
* **Activity Log**: Track all record activity
* **Approvals**: Manage approval workflows
* **Attachments**: Upload and view multiple files (250MB max per file)
* **Related Tasks**: Link and manage tasks
* **Relationships**: Show related records
* **Surveys**: Collect structured feedback
* **Update Feed**: Display record updates
Admins can also add **automation buttons** to the record details layout. These buttons let users run a chosen automation directly from the record (e.g. "Send for approval", "Generate report"). See [Automation Buttons](/workflows/automation-buttons) for configuration and behavior.
***
## Dynamic Record Details Layout
Dynamic layouts are available for **apps** only. Other objects, such as elements and tasks, do not currently support the dynamic Record Details Layout or its conditional visibility rules.
The Record Details Layout can render as a **dynamic layout** whose fields, sections, and components appear based on conditional visibility rules. Rules can be driven by other field values, the record's stage, or user and group permissions, so the same record can show different information depending on who is viewing it and its current state. The dynamic layout supports rich content types—attachments, tags, assignees, and rich text—alongside standard fields, letting you shape the record view to match your workflow instead of a one-size-fits-all page.
The dynamic layout coexists with the static layout: you can build and preview it while the static layout stays active for users, then activate the dynamic layout when you're ready.
App Administrators build a dynamic Record Details Layout as follows:
Open **App** → **User Interface** → **Record Details Layout** and switch to **Dynamic Layout** at the top of the page.
Click **Import** in the top-right corner to bring in the field configuration from the static layout, then click **Import and Replace**. Add or update components and fields as needed.
In the **Edit** popup for a field, section, or component, open the **Conditional Visibility** tab. Edit the filters to control when that item is visible—based on other field values, stage, or user and group permissions—then click **Save**.
Click **Layout Inactive** at the top of the page to make the dynamic layout the active layout for your users.
Conditional visibility rules are evaluated per user and per record, and a dynamic layout must be set to active before its rules apply to the live record details page.
***
## Example: Invoice Management Layout
```mermaid theme={null}
graph TD;
A[Header Section] -->|Fields| B[Status, ID, Title, Updated by, Updated on, Attachment]
A -->|Component| C[Configure Intelligence]
D[Invoice Data] -->|Fields| E[Invoice Summary, Invoice File, Invoice Number, Supplier Name, PO Number, Invoice Total, Spend Category, Ship To Address, Service Start, Service End, PO Line Memo, PO Line Type, Approver, Payment Terms]
F[Invoice to PO Matching] -->|Fields| G[Add Field Here]
```