在 WordPress 建站过程中，默认的文章头图和信息展示区域（Hero Section）往往缺乏个性。Blocksy Pro 提供的 Content Blocks 功能，支持你通过 Gutenberg 编辑器自定义并替换这些默认模块，实现动态加载的自定义文章布局。
这篇文章将手把手教你如何构建一个完全个性化的 Hero 区块，并将其应用于所有单篇文章模板，让你的网站内容既美观又模块化。
一、创建内容块（Content Block）
首先，登录后台并依次前往：
Blocksy > Content Blocks > Add New > Hook，新建一个内容块，命名为“Custom Hero Section”或你喜欢的名称。
进入 Gutenberg 编辑器后，开始构建页面结构。
二、构建自定义 Hero 结构
1. 添加 Group 块并设置背景
插入一个 Group 块
设置宽度为 Full Width（全宽）
选择一个背景颜色（如深灰）
自定义 class（例如：custom-hero-section）
2. 创建两栏布局
插入 Columns 块（两列结构）
左侧列：
插入 Post Featured Image（特色图像） 块：该模块将在前台动态加载当前文章的头图。
右侧列：
插入以下动态模块组成信息区：Post Author（作者）
Post Date（发布日期）
Post Title（标题）
Spacer（间隔）调整视觉
可选段落内容或说明文字
你也可以将这部分保存为 可重用模块，以便后续复用。
三、添加面包屑导航（Breadcrumb）
为了提升用户导航体验，可以添加面包屑导航：
插入 Shortcode 块
粘贴以下代码：
[bloxy_breadcrumbs]
Blocksy 会自动根据文章路径生成当前位置导航。
四、实时预览动态内容
为了在编辑器中预览动态数据（如标题、图像等），可打开：
Blocksy 设置 > Dynamic Content Preview，选择任意一篇文章作为预览源，即可实时查看内容加载效果。
五、设定挂钩位置与显示条件
完成设计后，在右侧 Blocksy 设置面板：
位置（Hook Location）：选择 Before Content
显示条件（Display Conditions）：选择 “All Single Posts”（所有单篇文章）
保存并发布该内容块。
六、效果验证
访问任意一篇文章，你将看到自定义的 Hero 区块已成功应用，并自动加载当前文章的内容信息。无需写代码，整洁美观、响应式良好。
总结
借助 Blocksy Pro 的内容块功能，你可以：
自由创建可重用的文章模板模块
实现动态内容的结构化呈现
通过 Gutenberg 编辑器完成一切，不依赖外部页面构建器
自定义 Hero Section 只是 Content Blocks 的一个应用场景。你还可以用它创建页眉、页脚、自定义 404 页面等，让整个网站更具品牌统一性与灵活性。