Kadence 教学:用 Kadence Blocks设置条件显示完整教学

在使用 Kadence Blocks Pro 设计 WordPress 页面时,可能会遇到某些内容只在特定情境下展示的需求。例如你根据特定条件动态控制页面元素(如区块、模块、内容等)的显示或隐藏。Kadence 的“条件显示”功能能根据特定字段或页面数据控制区块的可见性,让页面更具动态表现力。

20250331141238664-1743401542484

功能简介

条件显示可以用于多个核心区块,包括:

  • 高级图像
  • 高级文本
  • 区块 Section
  • 行布局
  • 单个图标
  • 图标列表
  • 高级按钮
  • 信息框

每个支持该功能的区块都能设置一条或多条条件,依据当前页面或文章的数据动态控制显示状态。

条件设置入口

选中支持的区块后,在右侧设置面板中进入“高级”选项卡,展开“条件显示设置”,即可开始配置。

20250329165345882-image

可选条件

系统提供了大量字段用于设置条件,比如:

  • 文章标题、类型、状态、日期、URL
  • 自定义字段
  • 特色图像 URL
  • 分类信息
  • 作者姓名、字段值
  • 评论数量
  • 归档标题与字段
  • 可重复字段中的子内容
20250329165510614-image

这些字段都可作为判断依据,用来决定某个区块是否展示。

条件数据来源

默认情况下,数据来源为当前文章或页面。如果有特别场景,比如需要从指定页面抓取字段值,也可以点击设置框中的铅笔图标,手动修改数据源。

20250329165537319-image

比较方式说明

条件设置中可以选用多种比较方式,包括:

  • 字段不为空时显示(Not Empty)
  • 字段为空时显示(Empty)
  • 值为 truefalse
  • 等于 / 不等于某个值
  • 大于 / 小于某个值
  • 大于等于 / 小于等于某个值
20250329165624681-image

灵活组合这些判断方式,可以实现多种展现规则。

应用示例:控制特色图像区块显示

在文章模板中,常常加入一个特色图像模块。若文章未设置图片,这个区块可能会在前端留下空白位置。

此时可以用条件显示功能,让该区块只在存在图像地址的情况下展示。

20250329165744670-image

操作步骤:

  • 选中高级图像区块
  • 打开右侧设置,进入高级选项卡
  • 添加条件字段为“特色图像 URL”
20250329170013723-image
  • 保持数据源为当前文章
20250329170020558-image
  • 比较方式选择“Not Empty”
20250329170034933-image

完成设置后,只有在有图像地址时,图片区块才会出现在页面中。反之则不显示,页面布局不会留下空隙。

效果对比

在没使用条件显示时,若文章未设图像,前端会保留空区域。
启用该功能后,系统将自动忽略这些无效内容,展示效果更整洁自然。

20250329170135173-image

总结

Kadence Blocks Pro 中的条件显示功能,为区块编辑带来了更多灵活性。借助这一工具,WordPress页面内容可以依据不同条件做出反应,省去手动修改模板的繁琐操作。

这项功能在展示文章内容、控制布局结构、实现定制化输出等场景中都非常实用,建议充分发挥其作用,让页面内容更有表现力。


了解 宝藏号 的更多信息

订阅后即可通过电子邮件收到最新文章。

© 版权声明

相关文章

暂无评论

none
暂无评论...

了解 宝藏号 的更多信息

立即订阅以继续阅读并访问完整档案。

继续阅读