diff --git a/exampleSite/config/_default/params.toml b/exampleSite/config/_default/params.toml index a23406290..7d910b9a1 100644 --- a/exampleSite/config/_default/params.toml +++ b/exampleSite/config/_default/params.toml @@ -27,9 +27,17 @@ enablePWA = false license = 'CC BY-NC 4.0' # [Experimental] Bundle js bundle = false -# [Experimental] cache remote images, more info: https://github.com/HEIGE-PCloud/DoIt/pull/860#issue-1574342372 -# [试验性功能] 缓存图床图片，详情请见：https://github.com/HEIGE-PCloud/DoIt/pull/860#issue-1574342372 -cacheRemoteImages = false +# [Experimental] cache remote images in markdown, more info: https://github.com/HEIGE-PCloud/DoIt/pull/860#issue-1574342372 +# [试验性功能] 缓存 markdown 中的图片链接到本地，详情请见：https://github.com/HEIGE-PCloud/DoIt/pull/860#issue-1574342372 +cacheRemoteImages = true +# [Experimental] generate image srcset attribute with hugo image processing feature. +# [试验性功能] 使用 hugo 自带的图片处理功能生成 srcset 属性 +optimizeImages = true +# [Experimental] resize method for srcset attribute in optimizeImages, more info: https://gohugo.io/content-management/image-processing/#image-processing-options +# [实验性功能] optimizeImages 中 srcset 属性的缩放方法, 详情请见：https://gohugo.io/content-management/image-processing/#image-processing-options +srcsetSmallResizeMethod = "700x webp Lanczos q75" +srcsetDefaultResizeMethod = "1200x webp Lanczos q75" +srcsetLargeResizeMethod = "2000x webp Lanczos q75" # Header config # 页面头部导航栏配置 [header] diff --git a/exampleSite/content/posts/theme-documentation-basics/index.en.md b/exampleSite/content/posts/theme-documentation-basics/index.en.md index 754f784ab..1175509b5 100644 --- a/exampleSite/content/posts/theme-documentation-basics/index.en.md +++ b/exampleSite/content/posts/theme-documentation-basics/index.en.md @@ -214,8 +214,14 @@ Please open the code block below to view the complete sample configuration :(far images = ["/logo.png"] # {{< version 0.2.11 >}} enable PWA support enablePWA = false - # [Experimental] cache remote images, more info: https://github.com/HEIGE-PCloud/DoIt/pull/860#issue-1574342372 - cacheRemoteImages = false + # [Experimental] cache remote images in markdown, more info: https://github.com/HEIGE-PCloud/DoIt/pull/860#issue-1574342372 + cacheRemoteImages = true + # [Experimental] generate image srcset attribute with hugo image processing feature. + optimizeImages = true + # [Experimental] resize method for srcset attribute in optimizeImages, more info: https://gohugo.io/content-management/image-processing/#image-processing-options + srcsetSmallResizeMethod = "700x webp Lanczos q75" + srcsetDefaultResizeMethod = "1200x webp Lanczos q75" + srcsetLargeResizeMethod = "2000x webp Lanczos q75" # {{< version 0.2.0 >}} App icon config # {{< version 0.2.14 >}} License information license = 'CC BY-NC 4.0' diff --git a/exampleSite/content/posts/theme-documentation-basics/index.zh-cn.md b/exampleSite/content/posts/theme-documentation-basics/index.zh-cn.md index 17845b493..cb71d1c0c 100644 --- a/exampleSite/content/posts/theme-documentation-basics/index.zh-cn.md +++ b/exampleSite/content/posts/theme-documentation-basics/index.zh-cn.md @@ -217,8 +217,14 @@ hugo images = ["/logo.png"] # {{< version 0.2.11 >}} 开启 PWA 支持 enablePWA = false - # [试验性功能] 缓存图床图片，详情请见：https://github.com/HEIGE-PCloud/DoIt/pull/860#issue-1574342372 - cacheRemoteImages = false + # [试验性功能] 缓存markdown中的图片链接到本地，详情请见：https://github.com/HEIGE-PCloud/DoIt/pull/860#issue-1574342372 + cacheRemoteImages = true + # [试验性功能] 使用 hugo 自带的图片处理功能生成 srcset 属性 +optimizeImages = true + # [实验性功能] optimizeImages 中 srcset 属性的缩放方法, 详情请见：https://gohugo.io/content-management/image-processing/#image-processing-options + srcsetSmallResizeMethod = "700x webp Lanczos q75" + srcsetDefaultResizeMethod = "1200x webp Lanczos q75" + srcsetLargeResizeMethod = "2000x webp Lanczos q75" # {{< version 0.2.14 >}} 版权信息 license = 'CC BY-NC 4.0' # {{< version 0.2.0 >}} 应用图标配置 diff --git a/layouts/_default/_markup/render-image.html b/layouts/_default/_markup/render-image.html index 31cfa0542..9441c0cb9 100644 --- a/layouts/_default/_markup/render-image.html +++ b/layouts/_default/_markup/render-image.html @@ -1,13 +1,13 @@ {{- $lightgallery := .Page.Params.lightgallery | default site.Params.Page.lightgallery | default false -}} {{- if .Title -}}
- {{- dict "Src" .Destination "Title" .Text "Caption" .Title "Linked" $lightgallery "Resources" .Page.Resources | partial "plugin/image.html" -}} + {{- dict "Src" .Destination "Title" .Text "Caption" .Title "Linked" $lightgallery "Resources" .Page.Resources "Optim" true "Remote" true | partial "plugin/image.html" -}}
{{- .Title | safeHTML -}}
{{- else -}}
- {{- dict "Src" .Destination "Title" .Text "Linked" $lightgallery "Resources" .Page.Resources | partial "plugin/image.html" -}} + {{- dict "Src" .Destination "Title" .Text "Linked" $lightgallery "Resources" .Page.Resources "Optim" true "Remote" true | partial "plugin/image.html" -}}
{{- end -}} diff --git a/layouts/_default/summary.html b/layouts/_default/summary.html index 1f38c69d2..459c87717 100644 --- a/layouts/_default/summary.html +++ b/layouts/_default/summary.html @@ -3,27 +3,10 @@
{{- /* Featured image */ -}} {{- $image := $params.featuredImagePreview | default $params.featuredImage -}} - {{- $height := "auto" -}} - {{- $width := "auto" -}} - {{- with .Resources.GetMatch (printf "%s" ($image)) -}} - {{- $image = .RelPermalink -}} - {{- $height = .Height -}} - {{- $width = .Width -}} - {{- end -}} - {{- with .Resources.GetMatch "featured-image" -}} - {{- $image = .RelPermalink -}} - {{- $height = .Height -}} - {{- $width = .Width -}} - {{- end -}} - {{- with .Resources.GetMatch "featured-image-preview" -}} - {{- $image = .RelPermalink -}} - {{- $height = .Height -}} - {{- $width = .Width -}} - {{- end -}} {{- with $image -}}
- {{- dict "Src" . "Title" $.Description "Resources" $.Resources "Height" $height "Width" $width "Loading" "eager" | partial "plugin/image.html" -}} + {{- dict "Src" . "Title" $.Description "Resources" $.Resources "Loading" "eager" "Optim" true | partial "plugin/image.html" -}}
{{- end -}} @@ -103,4 +86,4 @@

{{- end -}} -

\ No newline at end of file + diff --git a/layouts/partials/function/getImage.html b/layouts/partials/function/getImage.html new file mode 100644 index 000000000..c893b6d0a --- /dev/null +++ b/layouts/partials/function/getImage.html @@ -0,0 +1,17 @@ +{{- $path:= .Path -}} +{{- $imageResource := 0 -}} + +{{- with dict "Path" $path "Resources" .Resources | partial "function/resource.html" -}} + {{- $imageResource = . -}} +{{- else -}} + {{- $url := urls.Parse .Path -}} + {{- if (eq site.Params.cacheRemoteImages true) | and (partial "function/isUrlRemote.html" $url) | and .Remote -}} + {{- $imageResource = partial "function/getRemoteImage.html" $path -}} + {{- end -}} +{{- end -}} + +{{- if not (and (not (eq $imageResource 0)) (eq $imageResource.ResourceType "image")) -}} + {{- $imageResource = 0 -}} +{{- end -}} + +{{- return $imageResource -}} diff --git a/layouts/partials/function/imageHandler.html b/layouts/partials/function/imageHandler.html new file mode 100644 index 000000000..b27d60e3f --- /dev/null +++ b/layouts/partials/function/imageHandler.html @@ -0,0 +1,18 @@ +{{- $return := 0 -}} +{{- $suffixList := slice ".jpeg" ".jpg" ".png" ".gif" ".bmp" ".tif" ".tiff" ".webp" -}} + +{{- if not (eq .Optim true) -}} + {{- $return = dict "S" .Image "M" .Image "L" .Image "Optimized" false -}} +{{- else if or + (not (eq site.Params.optimizeImages true)) + (not (dict "Path" .Image.RelPermalink "Suffixes" $suffixList | partial "function/suffixValidation.html")) + -}} + {{- $return = dict "S" .Image "M" .Image "L" .Image "Optimized" true -}} +{{- else -}} + {{- $s := .Image.Resize (site.Params.srcsetSmallResizeMethod | default "700x webp Lanczos q60") -}} + {{- $m := .Image.Resize (site.Params.srcsetDefaultResizeMethod | default "1200x webp Lanczos q60") -}} + {{- $l := .Image.Resize (site.Params.srcsetLargeResizeMethod | default "2000x webp Lanczos q60") -}} + {{- $return = dict "S" $s "M" $m "L" $l "Optimized" true -}} +{{- end -}} + +{{- return $return -}} diff --git a/layouts/partials/function/isUrlRemote.html b/layouts/partials/function/isUrlRemote.html new file mode 100644 index 000000000..27956da19 --- /dev/null +++ b/layouts/partials/function/isUrlRemote.html @@ -0,0 +1 @@ +{{- return .Host | and .Path | and (strings.HasSuffix .Path "/" | not) -}} diff --git a/layouts/partials/function/resource.html b/layouts/partials/function/resource.html index 2d40d4826..d1e7eb4c2 100644 --- a/layouts/partials/function/resource.html +++ b/layouts/partials/function/resource.html @@ -1,6 +1,6 @@ {{- $resource := 0 -}} {{- $url := urls.Parse .Path -}} -{{- if not $url.Host | and $url.Path | and (strings.HasSuffix $url.Path "/" | not) -}} +{{- if not (partial "function/isUrlRemote.html" $url) -}} {{- if .Resources -}} {{- with .Resources.GetMatch $url.Path -}} {{- $resource = . -}} @@ -11,10 +11,6 @@ {{- $resource = . -}} {{- end -}} {{- end -}} -{{- else -}} - {{- if eq site.Params.cacheRemoteImages true -}} - {{- $resource = partial "function/getRemoteImage.html" .Path -}} - {{- end -}} {{- end -}} {{- return $resource -}} diff --git a/layouts/partials/plugin/image.html b/layouts/partials/plugin/image.html index a6227fc14..b0beed78c 100644 --- a/layouts/partials/plugin/image.html +++ b/layouts/partials/plugin/image.html @@ -1,30 +1,24 @@ {{- /* lightgallery.js */ -}} -{{- $src := .Src -}} +{{- $default := dict "RelPermalink" .Src -}} +{{- $remote := .Remote | default false -}} +{{- $optimize := .Optim | default false -}} +{{- $small := $default -}} +{{- $large := $default -}} {{- $height := "" -}} {{- $width := "" -}} -{{- $suffixList := slice ".jpeg" ".jpg" ".png" ".gif" ".bmp" ".tif" ".tiff" ".webp" -}} -{{- with dict "Path" .Src "Resources" .Resources | partial "function/resource.html" -}} - {{- $src = .RelPermalink -}} - {{- if and - (eq .ResourceType "image") - (dict "Path" $src "Suffixes" $suffixList | partial "function/suffixValidation.html") - -}} - {{- $height = .Height -}} - {{- $width = .Width -}} - {{- end -}} -{{- end -}} - -{{- $small := .SrcSmall | default $src -}} -{{- with dict "Path" .SrcSmall "Resources" .Resources | partial "function/resource.html" -}} - {{- $small = .RelPermalink -}} -{{- end -}} +{{- $optimized := false -}} -{{- $large := .SrcLarge | default $src -}} -{{- with dict "Path" .SrcLarge "Resources" .Resources | partial "function/resource.html" -}} - {{- $large = .RelPermalink -}} +{{- with dict "Path" .Src "Resources" .Resources "Remote" $remote | partial "function/getImage.html" -}} + {{- $output := dict "Optim" $optimize "Image" . | partial "function/imageHandler.html" -}} + {{- $small = $output.S -}} + {{- $default = $output.M -}} + {{- $large = $output.L -}} + {{- $optimized = $output.Optimized -}} + {{- $height = $default.Height -}} + {{- $width = $default.Width -}} {{- end -}} -{{- $alt := .Alt | default .Title | default $src -}} +{{- $alt := .Alt | default .Title | default .Src -}} {{- $loading := .Loading | default "lazy" -}} {{- with .Height -}} @@ -36,20 +30,35 @@ {{- end -}} {{- if .Linked -}} - + {{ $alt }} {{- else -}} {{ $alt }} {{- end -}} diff --git a/layouts/posts/single.html b/layouts/posts/single.html index 0d03dff5e..4a1c11280 100644 --- a/layouts/posts/single.html +++ b/layouts/posts/single.html @@ -146,25 +146,9 @@

{{ . }}

{{- /* Featured image */ -}} {{- $image := $params.featuredimage -}} - {{- $width := "auto" -}} - {{- $height := "auto" -}} - {{- with .Resources.GetMatch (printf "**%s" $params.featuredimage) -}} - {{- if eq .ResourceType "image" -}} - {{- $image = .RelPermalink -}} - {{- $width = .Width -}} - {{- $height = .Height -}} - {{- else -}} - {{- warnf "invalid featured image detected!" -}} - {{- end -}} - {{- end -}} - {{- with .Resources.GetMatch "featured-image" -}} - {{- $image = .RelPermalink -}} - {{- $width = .Width -}} - {{- $height = .Height -}} - {{- end -}} {{- with $image -}}
- {{- dict "Src" . "Title" $.Description "Resources" $.Resources "Width" $width "Height" $height "Loading" "eager" | partial "plugin/image.html" -}} + {{- dict "Src" . "Title" $.Description "Resources" $.Resources "Loading" "eager" "Optim" true | partial "plugin/image.html" -}}
{{- end -}} {{- /* Series list */ -}} diff --git a/layouts/shortcodes/image.html b/layouts/shortcodes/image.html index 4bb365af6..8e23075c7 100644 --- a/layouts/shortcodes/image.html +++ b/layouts/shortcodes/image.html @@ -11,6 +11,8 @@ {{- $options = dict "Width" (.Get "width") | merge $options -}} {{- $options = .Get "linked" | ne false | dict "Linked" | merge $options -}} {{- $options = dict "Rel" (.Get "rel") | merge $options -}} + {{- $options = dict "Optim" true | merge $options -}} + {{- $options = dict "Remote" true | merge $options -}} {{- else -}} {{- $options = cond $caption true false | dict "Linked" | merge $options -}} {{- end -}}