Kadence Hooked Elements 使用教程:轻松实现内容模块精准插入与布局

Kadence Hooked Elements 是 Kadence 主题 Pro 的强大功能,可以把内容模块精准地插入网站各个位置,实现灵活布局与动态内容更新,本文详细介绍 Kadence Hooked Elements 的作用与配置步骤。

图片[1]-Kadence Hooked Elements 使用教程:轻松实现内容模块精准插入与布局

一、什么是 Kadence Hooked Elements?

Kadence Hooked Elements 可以在页面的任意位置添加内容,例如:

  • 在 Black Friday 活动前添加倒计时,并在开始后自动消失
  • 在指定页面添加电子报订阅表单
  • 为特定产品页面设计独特头部

Kadence Theme 提供四种 Hooked Elements 元素类型:

  1. 内容区块(Content Section):在页面不同区域插入可复用内容
  2. 固定区块(Fixed Section):固定在页面顶部、底部或侧边栏,用户滚动时仍显示
  3. 模板(Templates):替换网站模板的某个部分,如头部、底部、文章布局
  4. HTML 编辑器(HTML Editor):使用原生 HTML 代码创建元素,灵活控制结构与样式

二、如何使用 Kadence Hooked Elements?

第一步:升级到 Kadence Pro

Kadence Hooked Elements 是 Kadence Theme Pro 的专属功能,使用前需要购买 Pro 版本:

  • 访问 Kadence 官网
  • 选择购买方案:
    1. Express(仅 Free Version,无法使用 Hooked Elements Pro 功能)
    2. Plus(包含 Theme Pro 功能)
    3. Ultimate(功能最全面,性价比最高)
图片[2]-Kadence Hooked Elements 使用教程:轻松实现内容模块精准插入与布局
  • 进入你的 Kadence 账户中心,下载 Kadence Pro 插件 zip 文件
图片[3]-Kadence Hooked Elements 使用教程:轻松实现内容模块精准插入与布局
  • 在 WordPress 后台选择:插件 > 安装插件,选择 zip 文件并安装,点击“启用插件”
图片[4]-Kadence Hooked Elements 使用教程:轻松实现内容模块精准插入与布局
  • 输入 License Key 激活 Pro 功能
图片[5]-Kadence Hooked Elements 使用教程:轻松实现内容模块精准插入与布局

第二步:启用 Hooked Elements 功能

  • 进入 WordPress 后台
  • 点击 Appearance > Kadence
图片[6]-Kadence Hooked Elements 使用教程:轻松实现内容模块精准插入与布局
  • 在 Pro Addons 列表中,开启“Hooked Elements”功能
图片[7]-Kadence Hooked Elements 使用教程:轻松实现内容模块精准插入与布局

第三步:创建新 Hooked Element

  • 进入 Appearance > Kadence > Elements,点击“Add New”创建新元素
图片[8]-Kadence Hooked Elements 使用教程:轻松实现内容模块精准插入与布局
  • 选择元素类型,如“内容区块(Content Section)”
图片[9]-Kadence Hooked Elements 使用教程:轻松实现内容模块精准插入与布局

第四步:设计你的元素

  • 点击“+”添加区块,搜索“Table of Contents”,选择并添加
图片[10]-Kadence Hooked Elements 使用教程:轻松实现内容模块精准插入与布局
  • 设置目录块的样式和配置,如果需要模板,可以在 Kadence Table of Contents 模板库免费下载导入
图片[11]-Kadence Hooked Elements 使用教程:轻松实现内容模块精准插入与布局

第五步:选择元素放置位置(Placement)

  • 点击右上角“Element Settings”
  • 在 Placement 下拉菜单中选择元素位置
图片[12]-Kadence Hooked Elements 使用教程:轻松实现内容模块精准插入与布局
  • 把目录放在文章第一个 H2 标题前,选择:Inside The Content > Before First Heading Tag
图片[13]-Kadence Hooked Elements 使用教程:轻松实现内容模块精准插入与布局
  • Priority 默认为 10,可根据需要调整显示顺序
图片[14]-Kadence Hooked Elements 使用教程:轻松实现内容模块精准插入与布局

第六步:配置显示设置(Display Settings)

  • 在 Show On 下拉菜单中选择:Posts > Single Posts
图片[15]-Kadence Hooked Elements 使用教程:轻松实现内容模块精准插入与布局
  • 在 Select Post By 中,选择:All(所有文章)
图片[16]-Kadence Hooked Elements 使用教程:轻松实现内容模块精准插入与布局
  • 如果需要隐藏,使用 Exclude Settings > Hide On 设置隐藏条件
图片[17]-Kadence Hooked Elements 使用教程:轻松实现内容模块精准插入与布局

第七步:配置用户可见性

在 Visible to 下拉菜单中设置可见用户:All Users(所有用户)

图片[18]-Kadence Hooked Elements 使用教程:轻松实现内容模块精准插入与布局

第八步:发布元素

点击“Publish按钮即可发布

图片[19]-Kadence Hooked Elements 使用教程:轻松实现内容模块精准插入与布局

三、总结

Kadence Hooked Elements 提供了强大的专业级功能,可以在网站的任何位置添加所需内容区块,根据不同用户角色、设备类型和显示条件进行精准投放,还支持设置自动到期隐藏元素,帮助灵活管理网站布局与内容展示,节省维护时间,提升整体运营效率和用户体验。


联系我们
教程看不懂?联系我们为您免费解答!免费助力个人,小企站点!
客服微信
客服微信
电话:020-2206-9892
QQ咨询:1025174874
邮件:info@361sale.com
工作时间:周一至周五,9:30-18:30,节假日休息
© 转载声明
本文作者:Millie
THE END
喜欢就支持一下吧
点赞1007 分享
评论 抢沙发

请登录后发表评论

    暂无评论内容