[WordPress] 外掛分享: Dynamic Post Grid – Gutenberg Blocks, Shortcodes & Elementor Addon

首頁外掛目錄 › Dynamic Post Grid – Gutenberg Blocks, Shortcodes & Elementor Addon
WordPress 外掛 Dynamic Post Grid – Gutenberg Blocks, Shortcodes & Elementor Addon 的封面圖片
20+
安裝啟用
尚無評分
15 天前
最後更新
問題解決
WordPress 5.0+ PHP 5.6+ v1.9.0 上架:2024-05-12

內容簡介

Dynamic Post Grid 是一款輕量級且對 SEO 友好的外掛,能以美觀的網格、磚石、列表和滑動佈局顯示文章、頁面、自訂文章類型及 WooCommerce 產品。它提供多種使用方式,並具備高效能與開發者靈活性。

【主要功能】
• Elementor 小工具 — 直接在 Elementor 中拖放文章/產品網格
• Gutenberg 區塊 — 原生區塊編輯器整合
• 獨立短碼生成器 — 可視化拖放編輯器建立自訂網格
• 四種佈局模式 — 網格、磚石、列表及滑動佈局
• 14 種區塊類型 — 包含縮圖、標題、元資料等
• AJAX 類別過濾 — 無需重新載入頁面即可過濾網格

外掛標籤

開發者團隊

⬇ 下載最新版 (v1.9.0) 或搜尋安裝

① 下載 ZIP → 後台「外掛 › 安裝外掛 › 上傳外掛」
② 後台搜尋「Dynamic Post Grid – Gutenberg Blocks, Shortcodes & Elementor Addon」→ 直接安裝(推薦)
📦 歷史版本下載

原文外掛簡介

Dynamic Post Grid is a lightweight, SEO-friendly plugin for displaying posts, pages, custom post types, and WooCommerce products in beautiful grid, masonry, list, and slider layouts. It works three ways: as a Gutenberg block, a standalone Shortcode Builder (no page builder needed), and an Elementor widget.
What makes this plugin different? Unlike other grid plugins that lock you into fixed templates, Dynamic Post Grid uses a block-based layout builder. Each grid is a JSON document describing individual blocks — making layouts serializable, exportable, shareable, and composable. Combined with transient caching, REST API, and Abilities API, it’s built for performance and developer flexibility.
Core Features

Elementor Widget — Drag-and-drop post/product grids directly inside Elementor with 7 layout styles and full styling controls.
Gutenberg Block — Native Block Editor integration with layout selector and attribute overrides.
Standalone Shortcode Builder — Build custom post grids with a visual drag-and-drop block editor. No Elementor required.
4 Layout Modes — Grid, Masonry, List, and Slider layouts with responsive columns.
14 Block Types — Thumbnail, title, meta, excerpt, read more, terms, divider, spacer, custom HTML, button, price, rating, custom field, and slider.
10 Hover Effects — Zoom In, Zoom Out, Grayscale to Color, Blur, Brightness, Overlay Fade, Overlay Slide Up, Overlay Slide Left, Overlay Scale, and Border Draw.
AJAX Category Filtering — Category filter buttons that reload the grid without page refresh.
Load More Pagination — AJAX-powered load more button for paginated grids.
Infinite Scroll — Automatic loading via Intersection Observer when scrolling near the bottom.
8 Style Presets — Built-in layout presets plus save and reuse your own custom presets.
WooCommerce Ready — Display products with price, ratings, add-to-cart buttons, and sale badges.
Transient Caching — Server-side caching for grid output with automatic invalidation.
REST API — Full API access to grid data for headless/decoupled usage.
Abilities API — WordPress 6.9+ AI-agent-ready abilities for programmatic grid operations.

Shortcode Reference
Basic Usage
[depg_grid id="123"]

All Attributes
[depg_grid id="123" layout_mode="grid" columns="3" per_page="6" orderby="date" order="DESC" filter="yes" filter_tax="category" load_more="yes" infinite_scroll="yes"]

Attribute
Type
Default
Description
id
integer
(required)
Shortcode post ID
layout_mode
string
grid
Layout mode: grid, masonry, list, or slider
columns
integer
3
Number of columns (1-4)
per_page
integer
6
Posts per page (-1 for all)
orderby
string
date
Sort by: date, title, ID, modified, rand, menu_order
order
string
DESC
Sort direction: ASC or DESC
filter
string
no
Show filter buttons: yes, 1, or true
filter_tax
string
auto
Taxonomy for filter buttons
load_more
string
no
Show Load More button: yes, 1, or true
infinite_scroll
string
no
Enable infinite scroll: yes, 1, or true
REST API
Endpoint: GET /wp-json/depg/v1/grid/{id}
Parameters: page, per_page, filter (term ID), taxonomy, layout_mode
Response:
json
{
"settings": {
"post_type": "post",
"layout_mode": "grid",
"columns": 3,
"per_page": 6,
"orderby": "date",
"order": "DESC"
},
"blocks": [...],
"posts": [
{
"id": 123,
"title": "Hello World",
"permalink": "https://example.com/hello-world/",
"excerpt": "This is a sample post...",
"date": "2026-07-18T10:00:00+00:00",
"author": { "id": 1, "name": "Admin" },
"featured_image": { "src": "...", "alt": "..." },
"terms": [{ "taxonomy": "category", "name": "Uncategorized" }]
}
],
"paging": {
"current_page": 1,
"max_num_pages": 5,
"total_posts": 48,
"remaining": 42
}
}
Abilities API (WordPress 6.9+)
Ability
Type
Description
dynamic-post-grid/render-grid
Read-only
Render a grid as HTML
dynamic-post-grid/get-grid-data
Read-only
Get structured post data as JSON
dynamic-post-grid/create-shortcode
Write
Create a new grid programmatically
dynamic-post-grid/export-layout
Read-only
Export layout as portable JSON
dynamic-post-grid/import-layout
Write
Import a layout JSON
Execute via: POST /wp-json/wp-abilities/v1/execute/{ability-name}

延伸相關外掛

文章
Filter
Apply Filters
Mastodon