> ## Documentation Index
> Fetch the complete documentation index at: https://help.dingtalk.io/llms.txt
> Use this file to discover all available pages before exploring further.

# Custom record detail and entry pages

> The record detail page is the core surface for viewing and editing a single row. AI Table gives you a visual builder so you can organize the page like building blocks.

## Overview

The record detail page is the core surface for viewing and editing a single row. AI Table gives you a visual builder so you can organize the page like building blocks.

1. **Custom layout** — drag components to plan information hierarchy and arrangement, building a data display tailored to your business.
2. **Reuse styles across an AI Table app** — a detail-page design built in a table syncs to list components in the AI Table app the first time they're opened, so you don't have to reconfigure for each. Consistent across surfaces.

## Workflow

> The flow: plan the page skeleton, then drop fields into the skeleton, then fine-tune. After customizing, field arrangement and grouping auto-apply to the new-record entry page too.

### Open the custom panel

1. **Open the detail page**: in a table, hover over a cell in the leftmost field and click the **Expand record** icon that appears.

2. **Enter custom mode**: click **Customize** at the top-right of the detail page to open the customization panel.

### Page settings

Once in custom mode, the right side defaults to page settings. Click **Done** at the top-right to save. From the dropdown, **Reset to default layout** restores the pre-customization defaults.

1. **Page title and title size**: pick a field as the detail-page title, and adjust title font size.

2. **Banner image**: pick an image-type field as the banner. After picking, set fill mode (Fill / Fit / Stretch) and layout (top-bottom / left-right). With left-right layout, set image size (Small / Medium / Large).

3. **Action buttons**: pin button-type fields from the table to the top of the detail page for quick action.
   * Use the master toggle to add buttons.

   * Click **+ New button** to create a new button field.

   * Click an existing button to fire its action.

4. **Follow view's hidden fields**: when on, the detail page auto-hides fields based on the current view's hidden-field config — different views can show different info.

### Tab groups

Tab groups categorize large amounts of info — switch tabs to jump between content areas.

1. **Add a tab group**: click **+ Add group** > **Tab group**.

2. **Configure the tab group**: select it; the right panel shows:

   * **Tab title and visibility**: name it; toggle title visibility.
   * **Tabs**: each tab group can hold multiple tabs. Click **Add tab** to add one — up to 20.
     * Edit tab names freely, drag to reorder, or remove unneeded tabs.
   * **Appearance**: tweak title color, background color, and border style of the tab area.

3. **Add content to a tab**: expand a tab and click **+ Add component** to drop fields or layout components in. Everything reorders by drag, including dragging in from outside the tab.

4. **Move a tab group**: drag it to the target position.

### Configure fields

Detail-page fields can sit inside regular groups or tab groups, and you can create new fields in place.

> Fields can't exist standalone — they need a component. Drop a field directly onto the detail page or tab and AI Table auto-creates a group to hold it.

1. **Add an existing field**: select a regular group or tab group, click **+ Add component**, and pick an existing field from the table.

2. **Create a new field**: **+ Add component** > **+ Add field** creates a new one. After config, the field appears in the table too.

3. **Remove a field**: select it, click **︙** > **Delete**.

4. **Change field config and style**: select it, edit in the right **Field** panel.

5. **Move a field**: select and drag.

When done, click **Done** at the top-right. The custom layout takes effect immediately.

### Custom detail pages in an AI Table app

When you first open a record from a list component in an AI Table app, the system pulls the detail-page style from the source table and applies it to the current component (first-time auto-sync only — after that, each is maintained independently).

1. **Reuse one design**: build the design in the source table, then open each list component in the corresponding apps once to trigger sync. Good when you want consistency across apps.
2. **Independent designs**: customize per list component directly in the app — each can have a totally different layout. App-side edits don't write back to the source table.

> Customizing a list component's detail page in an app requires **Manage** access on the AI Table app.

### Custom entry page

The entry page is the new-record form opened by **Add record**. You can customize its style and layout to match how data actually gets entered.

#### Open the entry-page customization panel

1. Open the entry page: in a grid view, click **Add record** — the new-record entry page opens.

2. Enter custom mode: click **Customize** at the top-right of the entry page.

#### Configure

Customizing the entry page is similar to the detail page. You can:

1. Reorder fields and groups: high-frequency fields on top, low-frequency or optional ones below — less burden on whoever's filling.
2. Use groups and tabs to organize structure: when there are many fields, group or tab them to keep the entry flow clear.

Entry-page layout is independent from detail-page layout — editing one doesn't affect the other.

## FAQ

#### Q: Does customizing the detail page affect other pages?

A: Partially. Field arrangement and grouping in the detail page auto-sync to the new-record entry page. In an AI Table app, list components first pull the source-table design when opened, but they're independent after that.

#### Q: If I switch a preset style, do my configured fields get lost?

A: No. The style only changes layout structure — field data and configuration are kept. After switching, you can keep tweaking.

#### Q: Who can customize the detail page?

A: Depends on permission mode. With Advanced Permissions off, anyone with **Edit** or **Manage** access can. With Advanced Permissions on, only users with **Manage** can. Customizing in an AI Table app requires the app's **Manage** access.
