速度优化

后台「主题设置 → 速度优化 → 图片处理」可对主题中的封面图、Banner、头像、文章内图片进行实时压缩缩放，减少带宽消耗，提升加载速度。

TIP

  • 此功能会对文章封面图和文章内图片进行分辨率压缩处理，以便达到速度优化效果

  • 如果图片存储在非 Halo 内部存储，需在对应服务端开启图片处理功能

  • 建议值仅供参考，以实际显示效果自主调试为准

  • 此功能测试中，无法保证所有功能正常，如有问题请反馈

选择处理模式

在「主题设置 → 速度优化 → 图片处理」中根据图片存放位置/CDN 选择处理模式：

图片存放位置

选择

说明

Halo 本地

Halo 内置附件存储

图片存储在 Halo 时选择此项

阿里云 ESA/DCDN

阿里云 ESA/DCDN

需在 ESA 控制台开启图片处理

阿里云 OSS

阿里云 OSS

需在 OSS 控制台开启图片处理

腾讯云 EdgeOne

腾讯云 EdgeOne

需在 EdgeOne 控制台开启图片处理

腾讯云 COS

腾讯云 COS（数据万象）

需开启数据万象图片处理

七牛云

七牛云

需在七牛控制台开启图片处理

又拍云

又拍云

需在又拍云控制台开启图片处理

其它 CDN/存储

自定义

自行填写参数格式

URL 后缀对照表

假设原图为 https://example.com/photo.jpg，图片宽度设为 1200px：

处理方式

实际 URL

参数格式

不处理

photo.jpg

—

Halo 内置附件存储

photo.jpg?width=1200

?width={width}

阿里云 ESA/DCDN

photo.jpg?image_process=resize,w_1200

?image_process=resize,w_{width}

阿里云 OSS

photo.jpg?x-oss-process=image/resize,w_1200

?x-oss-process=image/resize,w_{width}

腾讯云 EdgeOne

photo.jpg?eo-img.resize=w/1200

?eo-img.resize=w/{width}

腾讯云 COS

photo.jpg?imageMogr2/thumbnail/1200x

?imageMogr2/thumbnail/{width}x

七牛云

photo.jpg?imageView2/2/w/1200

?imageView2/2/w/{width}

又拍云

photo.jpg!/fw/1200

!/fw/{width}

自定义

自行填写

{width} 为宽度占位符

各宽度配置作用范围

配置项

作用于

首页卡片封面宽度

首页文章列表卡片封面图

文章页图片宽度

文章封面图 + 正文内图片

Banner 图片宽度

页面顶部 Banner 背景图

头像尺寸

侧边栏个人头像

TIP

选择「Halo 内置附件存储」时，文章正文内图片宽度由系统自动优化，不受「文章页图片宽度」设置控制。

验证图片处理是否生效

以选择阿里云 ESA/DCDN为例：

  1. 主题设置 → 图片优化 → 选择图片处理服务为阿里云 ESA/DCDN

  2. 文章页图片宽度设置为 1200 → 点击保存

  3. 回到网站页面 → 打开一篇文章

  4. 按 F12 打开浏览器开发者工具 → 按 Shift + Ctrl + R 强制刷新网页

  5. 通过筛选工具筛选图片，查看图片是否带 CDN/存储厂商的 URL 后缀

18c73eecd283e98f357.webp

如果图片后缀带 ?image_process=resize,w_1200，表示图片优化处理成功。

也可以对比带后缀和不带后缀的图片链接的加载大小，确保图片压缩正常。