Stacker

Search Documentation

Search for pages and topics in the documentation

6 min read

Customizing Layouts

Learn how to customize list views, detail pages, and dashboards to create the perfect portal experience for your users.

Types of Pages

Three building blocks for portal screens

List pages

Display multiple records in a table or card format. Users can filter, search, and sort to find what they need. Each table in your app can have a list page.

Detail pages

Show a single record with all its fields, related data, and actions. Customize which fields appear, how they're grouped, and what widgets are shown.

Dashboard pages

Overview pages with stats, charts, and quick links—ideal for home or summary views that give users a high-level picture.

Select and Edit

In the portal builder, you don't have to describe where something lives in the code. Use Select in the preview toolbar to turn on the element picker, click the part of the screen you care about—a heading, a button label, a card, a table column—and that choice is attached to your next message to the AI agent. From there, ask for the change in plain language: e.g. "Rewrite this headline for a logistics audience" or "Make this button say Approve instead."

This works on the live portal preview so the agent knows which DOM element you mean, not just which file is open.

How to use it

  1. Open your portal in the builder and switch to the Portal tab (the picker needs the running preview).
  2. Click Select in the toolbar above the preview. The button highlights while picking is active.
  3. Click the element in the preview—e.g. the page title, a paragraph, or a control—until the right piece is selected.
  4. In the AI chat, describe what you want changed. The agent can use your selection as the anchor for copy, layout, or behavior updates.
  5. To stop picking without choosing, click Cancel on the same control, or press Esc.

Example prompts

  • "Change this heading to Welcome back, {name}" (after selecting the heading)
  • "Soften the tone of this paragraph and shorten it by half"
  • "Turn this block into a two-column layout on desktop"

Page widgets

Page widgets are the blocks you arrange on a record page—a client, a job, an application, a shipment—so it becomes a destination, not a bare form. Layer fields for the story, related lists for everything tied to this row, stats for at-a-glance numbers, and activity for how things evolved.

Inspiration: a partner dashboard with contract terms up top, open deals in a related list, and quarter-to-date commission in stats; an applicant portal with intake fields grouped by section, uploaded files and messages alongside, and a timeline of status changes; a vendor workspace with PO lines below the header record and SLA-style counts above the fold. Same blocks—different stories.

Hover or focus a card for a compact example layout (illustrative, not a live portal).

Fields widget

Shape the narrative

Break long records into titled sections—"Company," "Billing," "Onboarding"—so clients see a profile, not a wall of inputs. Under the hood it's a grid of the fields you choose, with custom group titles.

Hover or focus for example

Related list widget

One hub, many threads

Pull in another table through a relation: invoices under a client, tasks under a project, line items under an order. Your portal becomes the single place someone opens to see the whole relationship—not five different bookmarks.

Hover or focus for example

Stats widget

Orient in seconds

Put the numbers people scan first—open balance, cases resolved this month, seats remaining, days in stage—above the fold. Totals, counts, and KPIs read as a headline before anyone scrolls into the details.

Hover or focus for example

Activity timeline

Show the journey

A chronological trail of what changed—notes, status moves, handoffs—so approvers and customers trust the process. Ideal for support histories, lightweight audit views, or "what happened since I last logged in."

Hover or focus for example