本文介绍为子比主题网站添加CTRL+D收藏按钮的两种方法：方法一通过WordPress小工具实现（无需修改主题文件，推荐），方法二直接修改主题底部文件。效果是在网站底部生成一个带有“Ctrl+D”快捷键提示的收藏按钮，引导用户快速收藏网站。

适用人群：使用子比主题的WordPress站长

核心价值：提升用户回访率，增强网站品牌记忆点

操作前准备

• 确定添加方式：如果不想改代码，推荐方法一（小工具）；如果需要更灵活地控制位置，可选择方法二（修改底部文件）。
• 备份网站：在添加任何代码前，建议先备份网站（特别是方法二）。
• 代码预览：最终效果是一个底部通栏，显示“赶紧收藏我们…按 Ctrl+D 收藏我们”的文字提示。

方法一：通过小工具添加（推荐）

这是最简单的方式，不需要修改任何主题文件，完全通过WordPress后台操作即可。

• 进入 WordPress后台 → 外观 → 小工具。
• 在左侧小工具列表中找到 “自定义HTML” 小工具，将其拖拽到右侧你希望显示的小工具区域（例如“所有页面-页脚区”或“底部全宽度”）。
• 在小工具的“标题”处可留空或输入“收藏本站”。
• 在“内容”文本框中粘贴以下完整代码：

• 点击 “保存” 按钮，然后刷新网站前台查看效果。

方法二：直接修改底部文件

如果需要将按钮放在页面底部的固定位置（如页脚最下方），可以直接修改底部模板文件。

• 进入 WordPress后台 → 外观 → 主题文件编辑器。
• 在右侧文件列表中找到 footer.php（或 /zibll/parts/footer/footer.php）。
• 在 </footer> 标签之前，粘贴方法一中的完整代码。
• 点击 “更新文件” 保存。

注意事项：

• 由于子比主题版本不同，底部文件结构可能略有差异。如果找不到 footer.php，请检查 /zibll/parts/footer/ 目录下的文件。
• 使用子主题（Child Theme）的用户，建议将修改放在子主题的 footer.php 中，避免主题升级时覆盖。

自定义样式与效果优化

调整按钮外观

修改CSS中的以下参数即可改变样式：

参数	说明	可调整值
background: #3d3d3d	底部背景色	改为 #19B5FE 等颜色
height: 60px	按钮栏高度	增大或减小
background: rgba(255, 197, 0, 1)	Ctrl+D 高亮背景色	改为网站主色调
border-radius: 5px	高亮框圆角	0（直角）、10px（更大圆角）

添加JavaScript一键收藏功能（可选）

如果希望点击文字直接触发收藏，而不仅仅提示快捷键，可以添加JavaScript代码：

功能验证

• 保存设置后，刷新网站前台页面。
• 滚动到页面底部，确认收藏按钮正常显示。
• 点击按钮或文字，验证是否弹出收藏提示（如果添加了JS功能）。

常见问题

问题	解决方法
按钮不显示	确认代码已完整粘贴并保存；检查是否放在正确的小工具区域或页面位置
样式错乱	检查CSS代码是否被其他样式覆盖；可尝试在CSS选择器前加 !important
升级主题后丢失	方法一（小工具）不受主题升级影响；方法二需在升级前备份代码