Hugo 图片懒加载

Overview

起因,想给文章插入的 img 图片添加 loading='lazy',果然有爱折腾的,看(这里),官方说明 #render-hook-templates,Hugo v0.62+

简单说能对md内的链接(link)和图像(image)自定义渲染,比如实现以上需求,只需在主题新建 layouts/_default/_markup/render-image.html

1layouts/_default
2├── _markup
3│   └── render-image.html

丢入代码:

1<p class="md_image">
2  <img loading='lazy' src="{{ .Destination | safeURL }}" alt="{{ .Text }}" {{ with .Title}} title="{{ . }}"{{ end }} />
3</p>

🐯🐶一下,收工!等等,这么简单?!再来个图片自动 jsdelivr cdn 前缀?