当猫哥推出网站时，很快就发现侧边栏在连接访客方面有多大的价值。
我们开始在侧边栏中使用图片，让它更具视觉吸引力，结果令人印象深刻。图片帮助我们推广免费课程、突出优惠券、展示热门文章，并引导读者访问不同类型的文章和工具包。只需一些视觉点缀，侧边栏就成了我们网站上推动互动和点击最有效的部分之一。
在本指南中，猫哥将教你如何在 WordPress 侧边栏小工具中添加图片——无论你使用什么主题，也无论你的技术经验如何。
TL;DR： 要在 WordPress 侧边栏添加图片，请进入后台的 外观 → 小工具，打开你的侧边栏小工具区域。然后点击“+”按钮添加一个新块，选择“图片”块，上传你想显示的图片。满意后点击“更新”保存即可。
为什么要在 WordPress 侧边栏添加图片？
在 WordPress 侧边栏添加图片，可以帮助吸引访客注意那些原本可能被忽略的重要内容、促销活动和行动号召。例如，你可以用侧边栏图片推广免费课程、突出特价优惠、展示热门内容，或引导用户访问网站的重要页面。
以下是在侧边栏添加图片的一些好处：
- 更高的点击率： 促销、诱饵和特价优惠的横幅图片通常比普通文本链接吸引更多点击。
- 更快的内容发现： 缩略图可以帮助访客快速找到符合他们兴趣的热门文章、资源或工具。
- 更低的跳出率： 设计良好的侧边栏为读者提供清晰的视觉指引，鼓励他们进一步探索你的网站。
在猫哥，我们发现侧边栏中推广免费课程和工具包的图片始终能带来点击，并帮助访客发现更多内容。
方法一：使用 WordPress 图片小工具块
注意： 本教程适用于使用标准 外观 → 小工具 界面的 经典主题。如果你使用的是 块主题（如 Twenty Twenty-Four 或 Twenty Twenty-Five）并启用了 全站编辑（FSE），则需要进入 外观 → 编辑器 → 模板部件 → 侧边栏，然后点击“+”按钮添加图片块，最后点击“保存”即可全局应用。
你可以使用默认的图片块在网站侧边栏添加照片。小工具区域现在使用与文章和页面相同的块编辑器，你可以轻松添加表单、相关文章、图片等元素。
首先，进入 WordPress 后台的 外观 → 小工具 页面。然后点击“+”按钮，添加一个图片块。
接下来，你可以通过三种方式添加图片：上传图片、从媒体库选择已有图片，或通过 URL 插入图片。
在块设置中，你可以更改样式和图片尺寸。同时务必添加 替代文本（alt text），这有助于屏幕阅读器理解图片内容，也是重要的 WordPress 图片 SEO 最佳实践。此外，建议将图片压缩并保存为 WebP 等现代格式，以提高页面速度和 Core Web Vitals 分数。WordPress 默认对侧边栏图片启用延迟加载，有助于减少初始页面加载时间。
专业提示： 为获得最佳效果，请使用宽度为 300px 的图片——大多数主题的标准侧边栏宽度。如果图片显示拉伸或过大，可以在块设置面板中将图片尺寸设为“中等”，或在 外观 → 自定义 → 额外 CSS 中添加 max-width: 100%; 以限制其宽度。
完成后，别忘了点击“更新”按钮。
然后访问你的网站，就可以在侧边栏看到图片了。
在块主题（全站编辑）中添加侧边栏图片
如果你使用的是块主题（如 Twenty Twenty-Four 或 Twenty Twenty-Five），则没有小工具屏幕。请进入 外观 → 编辑器，点击你的侧边栏模板部件，按“+”按钮，直接添加“图片”块。点击“保存”即可全局应用。更多信息可参考猫哥的全站编辑指南。
想让图片更互动？试试为图片添加热点，突出显示特定功能！
方法二：使用图片小工具插件
Image Widget 插件适合那些为客户管理网站或经常在新旧 WordPress 版本之间切换的用户。它提供统一的表单界面，无论编辑器版本如何都能一致工作。
首先，安装并激活 Image Widget 插件。然后进入 外观 → 小工具 页面，添加“Image Widget”块。
接下来，点击“选择图片”按钮上传图片或从媒体库选择。然后点击“插入到小工具”按钮，即可看到图片预览。
你可以添加标题、替代文本、链接和说明。还可以从可用选项中选择图片尺寸、调整对齐方式等。
满意后点击“更新”保存。现在你可以在网站侧边栏看到图片了。
方法三：使用图片画廊小工具
如果你想显示多张图片，可以使用“画廊”小工具而不是图片小工具。同样进入 外观 → 小工具 页面，点击“画廊”选项。
从这里你可以自定义画廊中的图片，例如让图片的边角变圆。满意后点击“更新”。
如果你需要更多自定义选项，推荐使用 Envira Gallery 插件。它提供移动响应、灯箱功能和优化速度，默认小工具缺乏这些特性。你还可以使用水印保护图片（Plus 及以上版本）。更多信息可参考猫哥的响应式图片画廊指南。
安装并设置好图库后，你会在块编辑器小工具中看到“Envira Gallery”小工具。
接下来只需选择要显示的图库，点击下拉菜单即可。
完成后可以进一步自定义，例如更改列布局、启用图片点击灯箱模式。满意后点击“更新”。
方法四：在经典小工具区域添加图片
如果你安装了 Classic Widgets 插件恢复了旧版小工具界面，也可以使用传统小工具添加图片。进入 外观 → 小工具 页面，将“图片”小工具添加到侧边栏。
展开小工具后，你可以看到设置选项。首先添加标题，然后点击“添加图片”按钮。这将打开 WordPress 媒体上传器，你可以上传新图片或选择已有图片。
上传后，你可以在右侧设置标题、替代文本、描述、尺寸，甚至添加链接。完成后点击“添加到小工具”。现在你可以在小工具设置区域看到图片预览。
别忘了点击“保存”按钮。然后访问网站，即可在侧边栏看到图片。
方法五：使用自定义 HTML 小工具块
有时你需要添加特定的跟踪类或高级属性，标准图片块不支持。这时可以手动添加图片。首先，上传图片到 WordPress 媒体库（媒体 → 添加新）。上传后，点击图片旁的“编辑”链接。
在“编辑媒体”页面右侧，你会看到图片文件 URL。复制这个 URL。
然后进入 外观 → 小工具 页面，添加“自定义 HTML”小工具块到侧边栏。
在文本框中输入以下代码：
<img src="粘贴你的文件 URL 这里" alt="草莓" />其中 src 属性定义图片文件位置，粘贴你复制的 URL；alt 属性用于提供替代文本。最终代码类似：
<img src="https://www.example.com/wp-content/uploads/2014/09/strawberries.jpg" alt="草莓" />点击“更新”保存设置，然后预览网站即可。
常见问题解答
如何在 WordPress 中让图片并排显示？
使用默认的“画廊”块即可。添加该块到内容中，从媒体库选择多张图片，WordPress 会自动将它们排列成网格布局。更多信息可参考猫哥的教程：如何轻松让图片在 WordPress 中并排显示。
如何编辑 WordPress 侧边栏小工具？
进入 外观 → 小工具，点击任何现有块即可更改设置、移动或删除。
如何在 WordPress 菜单栏中添加图片？
最简单的方法是使用 Menu Image 插件。安装后，进入 外观 → 菜单，每个菜单项旁会出现上传图标或照片的按钮。可参考猫哥的指南：为 WordPress 导航菜单添加图片图标。
如何设计 WordPress 侧边栏？
你可以使用拖放页面构建器（如 SeedProd）创建布局，无需代码。或者使用 外观 → 小工具 中的块编辑器，对块进行分组、添加背景色和样式化标题。
可以自定义小工具吗？
可以。大多数现代 WordPress 小工具都是块，可以完全自定义。点击编辑器中的小工具，使用右侧面板调整颜色、排版、对齐和可见性选项。
希望本文能帮助你成功在 WordPress 侧边栏小工具中添加图片。你可能还想查看猫哥精选的最佳拖放页面构建器，以及如何更改 WordPress 侧边栏方向。
如果你喜欢这篇文章，请订阅猫哥的 YouTube 频道获取 WordPress 视频教程。也可以在 Twitter 和 Facebook 上找到我们。