https://github.com/guqing/plugin-cloudinary

使用 Cloudinary 提供的服务来优化 Halo 主题端的图片媒体资源以提高网站的图片资源加载速度和性能。
https://github.com/guqing/plugin-cloudinary

cms halo image-compression plugin website website-builder

Last synced: about 2 months ago
JSON representation

使用 Cloudinary 提供的服务来优化 Halo 主题端的图片媒体资源以提高网站的图片资源加载速度和性能。

• Host: GitHub
• URL: https://github.com/guqing/plugin-cloudinary
• Owner: guqing
• License: gpl-3.0
• Created: 2024-03-22T07:27:11.000Z (11 months ago)
• Default Branch: main
• Last Pushed: 2024-04-19T08:25:38.000Z (10 months ago)
• Last Synced: 2024-04-19T09:32:51.381Z (10 months ago)
• Topics: cms, halo, image-compression, plugin, website, website-builder
• Language: Java
• Homepage:
• Size: 5.84 MB
• Stars: 3
• Watchers: 1
• Forks: 0
• Open Issues: 1
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# plugin-cloudinary

>[!WARNING]

> 目前已经在 Halo [#6454](https://github.com/halo-dev/halo/pull/6454) 中实现了缩略图功能，因此本插件不再维护。

使用 Cloudinary 提供的服务来优化 Halo 主题端的图片媒体资源以提高网站的图片资源加载速度和性能。

## How does it work?

1. 通过拦截主题端的 HTML 页面，解析其中的 `` 元素得到图片资源的 URL。

2. 通过 Cloudinary 提供的 API 生成不同尺寸且格式为 Webp 的图片资源 URL。

3. 修改 HTML 页面中的 `` 元素，增加 `srcset` 属性，以便浏览器根据不同的屏幕尺寸选择合适的图片资源加载。

通过以上步骤，可以有效地提高网站的图片资源加载速度和性能。

## Configuration

1. 在 [Cloudinary](https://console.cloudinary.com/) 注册账号。

2. 在 Cloudinary 控制台的 Getting Started 页面中找到 Cloud name、API Key 和 API Secret 信息，可以点击 View Credentials 查看。

3. 在 Halo 后台的插件管理中配置此插件的 Cloud name、API Key 和 API Secret 信息为对应的值。

4. 保存配置并清理一下页面缓存就已经生效了。