Skip to main content
Learnengineawesome

Grid

The Grid block arranges its contents in a structured multi-column, multi-row layout. Where a Row gives you a single horizontal line of blocks, a Grid lets you fill a full two-dimensional area - like a 2-column dashboard or a 3-across card gallery. You configure the number of columns and the Grid fills them automatically as you add blocks.

When to use it

  • A stats dashboard with 4 metric tiles arranged in a 2x2 or 4-column layout.
  • A card gallery for contacts, products, or projects where each card sits in its own grid cell.
  • Displaying multiple query results or summaries side by side for easy comparison.
  • A form with many fields that you want to display in two or three columns to reduce scrolling.
  • A dashboard homepage with distinct sections - each section a cell in the grid.

How to add it

  1. Open the layout editor.
  2. Click Add Block in the position where you want the grid.
  3. Select Grid from the block type list.
  4. In the Grid settings, choose Auto or Manual mode.
  5. If using Manual mode, set the number of columns.
  6. If using Auto mode, set the minimum column width - the Grid will fit as many columns as possible given that minimum.
  7. Add blocks inside the Grid - each block fills the next available cell.
  8. Save and publish your layout.

Configuration options

  • Auto mode : The Grid determines how many columns fit based on the minimum column width you set. On a wide screen you might get 4 columns; on a narrow screen, 2. Good for responsive layouts.
  • Manual mode : You set a specific number of columns (e.g. exactly 3). The columns divide the available width equally.
  • Minimum column width (Auto mode): Sets the smallest a column can be before the grid wraps to fewer columns.
  • Columns (Manual mode): The exact number of columns in the grid.
  • Conditional visibility : Show or hide the entire Grid based on a field condition.
  • Sticky position : Keep the Grid fixed at the top of the page while scrolling.

Example

You're building a sales dashboard homepage. You want to show four key metrics at the top of the page: Total Leads, Open Deals, Revenue This Month, and Closed Deals This Quarter. You add a Grid block set to Manual mode with 4 columns. Inside the Grid, you add four Stat widget blocks - one for each metric. They fill the four cells of the grid, appearing side by side in a clean, scannable row. Below the grid, the rest of the dashboard continues normally.

Tips

  • For dashboards, a 2- or 4-column Manual grid with Stat or Chart widgets gives you a professional, organized look without complex configuration.
  • Use Auto mode when you're not sure how many columns will look right, or when you want the layout to adapt to different screen sizes.
  • Each cell in the Grid can contain any block type - another Row, a Stack, a field, a widget, or even another Grid for nested layouts.
← PreviousStackNext →Image