Using the Canvas

Step-by-step guide to adding, reordering, and configuring items in the Canvas UI.

Opening the Canvas

The Canvas UI opens automatically when you edit a meta group, a form, a table (step 2 — Columns), or a dynamic block. There is nothing to configure before using it.

Adding an item

1. In the sidebar, browse or scroll through the available types.

2. Click a type (e.g. Text field) to add it at the bottom of the canvas, or drag it to a specific position.

3. The new item is selected immediately and its settings panel opens.

Clicking always appends the item to the end of the canvas; dragging lets you drop it at a specific position instead.

Click a type in the sidebar to add it to the canvas.

Editing an item

Click any item in the canvas to open its settings in the right-hand panel (or below the item, depending on the context). Edit the settings and they are saved automatically.

Editing fields inline

Some values shown on a canvas card — for example a field's label — can now be edited directly by clicking into them, without opening the full settings panel. This gives you a faster path for quick renames. Exactly which values are inline-editable depends on the context; see the form builder page for the Forms-specific behavior.

Inline edits and the settings panel stay in sync live: if the panel is open at the same time, changes made inline appear there immediately, and vice versa.

Some values are locked from inline editing — and from being re-added to the canvas — when they're bound to an existing meta field, CCT column, or WordPress core field, so that binding can't be broken. See the form builder page for a concrete example.

Reordering items

Grab the drag handle (the ⠿ grip icon on the left of each item) and drag it up or down to change its position. The order in the canvas is the order items appear in the admin record form and in front-end output.

Duplicating an item

Click the Duplicate icon in the item's actions bar to create an identical copy immediately below it. The copy gets a new unique name.

Deleting an item

Click the Delete icon in the item's actions bar, then confirm in the modal. Deleting a field/column removes its saved values — this action cannot be undone.

Deleting a column from a CCT table removes the column definition and its data from the database. Make sure you have a backup before deleting columns from tables that contain records.

No-distraction mode

Click the No-distraction toggle in the top-right toolbar to hide the WordPress admin sidebar and top bar. This gives you the maximum canvas working area. The preference is remembered per session.

No-distraction mode hides the WordPress chrome for a focused editing experience.

Resizing the panels

Drag the vertical divider between the sidebar and canvas to resize them. The layout is saved to localStorage and restored the next time you open the same entity.

Choosing the sidebar position

Two icon buttons in the toolbar let you dock the sidebar on the left or right side of the canvas — useful if you prefer the field list closer to a particular side of your screen. The choice is remembered per entity (per meta group, form, table, or block), using the same preference mechanism as no-distraction mode, so switching to a different entity won't carry the setting over.

Keyboard shortcuts

Shortcut	Action
Escape	Deselect the active item

Nestable items (Repeater / Flexible)

Repeater fields and flexible blocks contain child items. Click the repeater/flexible item to expand it, then use the inner Add child button to add sub-fields. Child fields support the same drag-and-drop reordering as top-level fields.

A repeater column expanded to show its child columns.

Saving

Changes in the Canvas UI are staged locally. Click the Save button in the page actions bar (top-right) to persist all changes to the database.