Kadence 教学：用 Kadence Repeater Block 构建动态内容模板

在 WordPress 建站中，如果需要展示 ACF 或 Meta Box 中的重复字段内容，传统方法需要编写 PHP 模板或短代码。现在，借助 Kadence Blocks Pro 提供的 Kadence Repeater 区块，可以直接在 Gutenberg 编辑器中完成这一切，不用接触代码，就能将设计和内容展示一次搞定。

什么是 Kadence Repeater 区块

Kadence Repeater 是一个高度可视化的编辑模块，支持展示以下插件中的重复字段内容：

• Advanced Custom Fields Pro（ACF）中的 Repeater 字段
• Meta Box 插件中的可克隆 Group 字段（Group 字段本身应设置为可克隆）

在 Gutenberg 编辑器中插入该区块后，只用简单配置数据来源和字段，就能循环展示相关数据，同时自由使用 Kadence Blocks 中的任意区块进行设计调整。

需要准备的插件

要正常使用 Kadence Repeater 区块，需要安装以下工具组合之一：

• Kadence Blocks + Kadence Blocks Pro
• ACF Pro 或 Meta Box（需包含 Meta Box Group 插件）

典型场景示例：赞助商展示列表

假设你有一个名为“赞助商”的 Repeater 字段，包含以下子字段：

• 赞助商名称
• 赞助商徽标
• 赞助商链接
• 赞助商介绍

现在要将这些信息展示在网站首页。传统方法是写 PHP，现在只需要以下几个步骤。

第一步：添加 Repeater 区块

在 Gutenberg 编辑器中插入 Kadence Repeater 区块，按照向导操作：

• 选择数据来源（ACF 或 Meta Box）
• 选中“赞助商”字段

• 选择一个起始布局作为模板起点

系统将加载字段内容，并为你预填一些初始区块。

第二步：设计内容模板

在加载完成的模板中，可以自由添加和编辑区块，展示对应字段内容。推荐使用以下区块：

• Text (Adv)：展示赞助商名称
• Image (Adv)：展示徽标，并添加链接
• Dynamic HTML：展示介绍信息

编辑每个支持动态内容的区块时，点击区块中的动态内容图标，启用“使用 Repeater 上下文”选项，并从下拉菜单中选择对应子字段，如“赞助商徽标”、“赞助商名称”等。

第三步：预览和调整

若在 Kadence Element 中使用该区块，请在右侧设置中选择一个包含目标字段的示例文章或页面作为预览对象，方便加载和查看实际数据效果。

区块设置说明

常规设置

• 源（Source）：选择字段数据来源（ACF、Meta Box、选项页等）

• 中继器字段（Repeater Field）：选中需要展示的字段

• 列设置（Columns）：为桌面、平板和移动设备设定列数

• 列间距与行间距：分别定义各设备下的布局间距

高级设置

• Padding 和 Margin：自定义边距值

• HTML 锚点 ID：用于导航定位

• CSS 类名：自定义样式扩展

• 支持保存为默认配置，便于重复使用

展示选项页面或设置页面中的字段

若字段不属于文章、页面等标准内容，而是创建在 ACF 的选项页面或 Meta Box 的设置页面中，也可使用 Repeater 区块进行展示：

• 在区块设置中，Source 选择“选项页面”或“设置页面”
• 在下方的“Repeater 字段”中选中目标字段
• 添加设计区块并绑定对应内容字段

结语

Kadence Repeater 区块为重复字段展示带来了极大的灵活性与便利性。设计不再依赖模板文件，数据展示可以在可视化界面中快速搭建。搭配 Kadence Blocks 中的其他高级区块，还能实现更丰富的展示效果。