Skip to content

The data grid

The main table view

The main content area is an AG Grid table. It is the primary "data table" for posts and content.

Data grid with columns: thumbnail, title, author, date, status, actions

Rows and columns

  • Rows: One row per post (or placeholder/skeleton while loading). Each row has a stable row ID (usually the post id) so selection and updates are consistent.

  • Columns: Depend on post type and column config. Default columns typically include: Image (thumbnail), Title (with optional subtitle), Author, Date, Categories, Status, Labels/Tags, and Actions. Optional: ID, Template (pages), Parent (hierarchical types), etc. Columns can be sorted, filtered (per-column), resized, and reordered (see Column management).

Cell renderers

Each column uses a renderer by data type so cells show the right UI:

  • Image: Thumbnail with fallback.

  • Title: Title and optional subtitle (link or plain text).

  • Author: Avatar and name; often editable (dropdown or popover).

  • Date: Formatted date; often editable (date picker).

  • Status: Badge or label; often editable (dropdown).

  • Category: List of categories; often editable (multi-select).

  • Labels: Tags/labels; often editable (multi-select).

  • Actions: Buttons: Edit, Duplicate, Delete (see Row actions).

You see and edit the right kind of value in each column without opening the full editor.

Pagination and page size

  • Pagination: When enabled, the grid shows one page of rows (e.g. 20, 50, or 100). Page size selector is usually in the grid footer. You can change the page size; the list re-paginates immediately.

  • The chosen page size can be stored in localStorage (per grid/post type) so it's remembered next time. Key is typically derived from a pageSizeStorageKey (e.g. fleekdash_posts_grid_page_size_post).

Work with large lists in chunks and keep your preferred page size.

Performance (virtualization and buffering)

  • The grid uses client-side row model: all rows for the current filters are in memory; sorting and filtering are done in the browser.

  • Row virtualization (suppressRowVirtualisation: false) and column virtualization keep only visible (and buffered) rows/columns in the DOM, so scrolling stays smooth with many rows.

  • rowBuffer (e.g. 50) and rowHeight (e.g. 68px) help the grid pre-render rows around the viewport. animateRows gives smooth add/remove when data changes.

Instant loading and scrolling even with hundreds or thousands of posts, without leaving the list.

<!-- seo-geo: content-enrichment -->

In practice

AG Grid table view, rows and columns, cell renderers, pagination, performance. On this page, The main table view is covered in detail: what it looks like in the admin, the exact controls it exposes, and how it behaves when you use it day to day. The sections above walk through Rows and columns, Cell renderers, Pagination and page size, Performance (virtualization and buffering) in order, so you can skim headings and jump straight to the part you need. Because the main table view is part of Data Tables — a fast, sortable, filterable grid with inline editing, bulk actions, and column control for every post type — the settings you touch here interact with the rest of the feature; when in doubt, open the feature overview and follow the docs in order.

See also

Need a hand? Contact support or head back to the Data Tables guide.