Tab Panel

The Tab Panel block divides a layout into multiple named tabs. Each tab contains its own independent set of blocks - fields, widgets, query results, text, or anything else you'd put in a layout. Only one tab is visible at a time. Users click a tab label to switch to that section without navigating away from the page. This keeps long or complex pages organized and easy to read.

When to use it

• A contact detail page that separates "Contact Info", "Notes", and "Activity" into tabs so the page doesn't become overwhelming.
• A project page with tabs for "Overview", "Tasks", and "Files" - each section stays out of the way until needed.
• A settings page with categories like "General", "Notifications", and "Integrations" separated into tabs.
• A long data entry form broken into logical steps or sections ("Step 1: Personal Info", "Step 2: Service Details").
• A record view that shows related data from other objects in separate tabs - for example, a client with a "Deals" tab showing related opportunities.

How to configure it

1. Open the layout editor.
2. Click Add Block in the position where the tabbed section should appear.
3. Select Tab Panel from the block type list.
4. The Tab Panel starts with two default tabs. Click a tab label to rename it.
5. Click Add Tab to add more tabs as needed.
6. Click inside each tab to add blocks - each tab has its own independent content area.
7. Drag and drop blocks from your block library into the active tab.
8. Repeat for each tab until all sections are built out.
9. Save and publish your layout.

Example

You manage a CRM and your contact detail page was getting long - name, email, phone, address, notes, last contact date, and a list of related deals all on one scrolling page. You add a Tab Panel with three tabs: Contact Info (name, email, phone, company, address), Activity (notes field, last contact date, next follow-up date), and Deals (a query block showing related deal records). Now the page is clean and organized. A team member can quickly glance at contact info, then flip to Deals to see what's in the pipeline - without scrolling through everything at once.

Tips

• Put the most important or frequently used information in the first tab, since that's what users see by default when they open the page.
• Each tab is fully independent - you can put any combination of fields, widgets, query blocks, or design elements inside each one.
• Avoid creating too many tabs (more than 5 or 6) - if you have that many sections, consider breaking the page into separate pages instead.