mirror of
https://github.com/hugo-fixit/FixIt.git
synced 2026-08-24 15:28:57 +00:00
feat: add blacklist option for image optimisation and adapt Hugo 0.153.0+ (#666)
* feat: add blacklist option for image optimisation and enhance shortcode parameters To ensure compatibility with Hugo 0.153.0, converting GIFs to WebP is prohibited. (gohugoio/hugo#14282) * feat: enhance image plugin with Matches parameter for better resource handling and improve featured image rendering
This commit is contained in:
Cell
@@ -1086,6 +1086,9 @@ userId = ""
|
||||
cacheRemote = false
|
||||
# Image resizing and optimisation
|
||||
optimise = false
|
||||
# FixIt 0.4.0 | NEW A list of image file names or patterns to exclude from optimisation
|
||||
# e.g. ["no-optimize.jpg", "*.tiff", "images/exclude-*.webp"]
|
||||
blackList = []
|
||||
|
||||
# FixIt 0.4.0 | NEW Code block wrapper config
|
||||
# you can override the global config via Markdown attributes, for example:
|
||||
|
||||
@@ -22,36 +22,64 @@ Parameters:
|
||||
- Loading: Indicates how the browser should load the image: eager or lazy. https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#loading
|
||||
- Optimise: Override the site parameter to optimise the image.
|
||||
- CacheRemote: Override the site parameter to cache remote images.
|
||||
- BlackList: A list of image file names or patterns to exclude from optimisation, default is from site parameter.
|
||||
- Matches: If the image is a page resource, this parameter can help to find the resource by names. e.g. ["featured-image", "featured-image-preview"].
|
||||
|
||||
Thanks @HEIGE-PCloud for the original code in the DoIt theme.
|
||||
https://github.com/HEIGE-PCloud/DoIt/blob/main/layouts/_partials/plugin/image.html
|
||||
*/ -}}
|
||||
|
||||
{{- $config := site.Params.image -}}
|
||||
{{- $Resources := .Resources | default page.Resources -}}
|
||||
{{- $isInline := strings.HasPrefix .Src "data:image" -}}
|
||||
{{- $isRemote := urls.Parse .Src | partial "function/is-url-remote.html" -}}
|
||||
{{- $resource := dict -}}
|
||||
|
||||
{{- /* Get local image resource */ -}}
|
||||
{{- if not $isRemote | and (not $isInline) -}}
|
||||
{{- $resource = (.Resources.Get .Src) | default (resources.Get .Src) -}}
|
||||
{{- /* Try to get resource by matched names */ -}}
|
||||
{{- $matchNames := .Matches | default (slice (strings.TrimPrefix "./" (urls.Parse .Src).Path)) -}}
|
||||
{{- range $matchNames -}}
|
||||
{{- $resource = $Resources.GetMatch . -}}
|
||||
{{- if $resource -}}{{- break -}}{{- end -}}
|
||||
{{- end -}}
|
||||
{{- /* Try to get resource from page or global resources */ -}}
|
||||
{{- $resource = $resource | default ($Resources.Get .Src) | default (resources.Get .Src) -}}
|
||||
{{- end -}}
|
||||
|
||||
{{- $cacheRemote := .CacheRemote | default site.Params.image.cacheRemote | default false -}}
|
||||
{{- $optimise := .Optimise | default site.Params.image.optimise | default false -}}
|
||||
|
||||
{{- /* Get remote image resource */ -}}
|
||||
{{- $cacheRemote := .CacheRemote | default $config.cacheRemote | default false -}}
|
||||
{{- if not $resource | and $cacheRemote -}}
|
||||
{{- with partial "function/get-remote-image.html" (dict "Src" .Src) -}}
|
||||
{{- $resource = . -}}
|
||||
{{- end -}}
|
||||
{{- end -}}
|
||||
|
||||
{{- /* Check if the image is blocked from optimisation */ -}}
|
||||
{{- $blackList := .BlackList | default $config.blackList | default slice -}}
|
||||
{{- $isBlocked := false -}}
|
||||
{{- $regex := "" -}}
|
||||
{{- $disableImageTypes := slice "svg" "gif" -}}
|
||||
{{- $isSvg := false -}}
|
||||
{{- with $blackList -}}
|
||||
{{- $regex = replace (delimit . "|") "." "\\." -}}
|
||||
{{- $regex = replace $regex "*" ".*" -}}
|
||||
{{- end -}}
|
||||
{{- if $resource -}}
|
||||
{{- $isSvg = (eq $resource.MediaType.SubType "svg") -}}
|
||||
{{- if $regex -}}
|
||||
{{- $isBlocked = gt (findRE $regex $resource.Name | len) 0 -}}
|
||||
{{- end -}}
|
||||
{{- if not $isBlocked -}}
|
||||
{{- $isBlocked = in $disableImageTypes $resource.MediaType.SubType -}}
|
||||
{{- end -}}
|
||||
{{- $isSvg = eq $resource.MediaType.SubType "svg" -}}
|
||||
{{- end -}}
|
||||
|
||||
{{- /* Optimise image and generate srcset processing */ -}}
|
||||
{{- $optim := .OptimConfig -}}
|
||||
{{- $optimise := .Optimise | default $config.optimise | default false -}}
|
||||
{{- $srcset := "" -}}
|
||||
{{- if $optim | and $resource | and $optimise | and (not $isSvg) -}}
|
||||
{{- if $optim | and $resource | and $optimise | and (not $isBlocked) -}}
|
||||
{{ $srcsetSlice := slice -}}
|
||||
{{- range $optim -}}
|
||||
{{- if .Process -}}
|
||||
|
||||
@@ -9,6 +9,8 @@
|
||||
(dict "Process" "resize 1600x webp q75" "descriptor" "1600w")
|
||||
-}}
|
||||
{{- $options = dict "OptimConfig" $optim | merge $options -}}
|
||||
{{- $optimise := .Get "optimise" -}}
|
||||
{{- $cacheRemote := .Get "cacheRemote" -}}
|
||||
|
||||
{{- if .IsNamedParams -}}
|
||||
{{- $options = dict "Title" (.Get "title") | merge $options -}}
|
||||
@@ -17,8 +19,8 @@
|
||||
{{- $options = .Get "linked" | ne false | dict "Linked" | merge $options -}}
|
||||
{{- $options = dict "Rel" (.Get "rel") | merge $options -}}
|
||||
{{- $options = dict "Loading" (.Get "loading" | default "lazy") | merge $options -}}
|
||||
{{- with (.Get "optimise") -}}{{- $options = dict "Optimise" . | merge $options -}}{{- end -}}
|
||||
{{- with (.Get "cacheRemote") -}}{{- $options = dict "CacheRemote" . | merge $options -}}{{- end -}}
|
||||
{{- if ne $optimise nil -}}{{- $options = dict "Optimise" $optimise | merge $options -}}{{- end -}}
|
||||
{{- if ne $cacheRemote nil -}}{{- $options = dict "CacheRemote" $cacheRemote | merge $options -}}{{- end -}}
|
||||
{{- else -}}
|
||||
{{- $options = cond $caption true false | dict "Linked" | merge $options -}}
|
||||
{{- end -}}
|
||||
|
||||
@@ -138,20 +138,18 @@
|
||||
|
||||
{{- /* Featured image */ -}}
|
||||
{{- $image := $params.featuredimage -}}
|
||||
{{- with dict "Path" $image "Resources" .Resources | partial "function/resource.html" }}
|
||||
{{- $image = .RelPermalink }}
|
||||
{{- end }}
|
||||
{{- with .Resources.GetMatch "featured-image" -}}
|
||||
{{- $image = .RelPermalink -}}
|
||||
{{- $matches := slice -}}
|
||||
{{- if .Resources.GetMatch "featured-image" -}}
|
||||
{{- $matches = $matches | append "featured-image" -}}
|
||||
{{- end -}}
|
||||
{{- with $image -}}
|
||||
{{- if $image | or (gt (len $matches) 0) -}}
|
||||
<div class="featured-image">
|
||||
{{- $optim := slice
|
||||
(dict "Process" "resize 800x webp q75" "descriptor" "800w")
|
||||
(dict "Process" "resize 1200x webp q75" "descriptor" "1200w")
|
||||
(dict "Process" "resize 1600x webp q75" "descriptor" "1600w")
|
||||
-}}
|
||||
{{- dict "Src" . "Title" $.Description "OptimConfig" $optim | partial "plugin/image.html" -}}
|
||||
{{- dict "Src" $image "Title" $.Description "Resources" .Resources "Matches" $matches "Loading" "eager" "OptimConfig" $optim | partial "plugin/image.html" -}}
|
||||
</div>
|
||||
{{- end -}}
|
||||
|
||||
|
||||
+7
-10
@@ -3,16 +3,13 @@
|
||||
<article class="single summary" itemscope itemtype="http://schema.org/Article">
|
||||
{{- /* Featured image */ -}}
|
||||
{{- $image := $params.featuredimagepreview | default $params.featuredimage -}}
|
||||
{{- with dict "Path" $image "Resources" .Resources | partial "function/resource.html" }}
|
||||
{{- $image = .RelPermalink }}
|
||||
{{- end }}
|
||||
{{- with .Resources.GetMatch "featured-image" -}}
|
||||
{{- $image = .RelPermalink -}}
|
||||
{{- $matches := slice -}}
|
||||
{{- if .Resources.GetMatch "featured-image-preview" -}}
|
||||
{{- $matches = $matches | append "featured-image-preview" -}}
|
||||
{{- else if .Resources.GetMatch "featured-image" -}}
|
||||
{{- $matches = $matches | append "featured-image" -}}
|
||||
{{- end -}}
|
||||
{{- with .Resources.GetMatch "featured-image-preview" -}}
|
||||
{{- $image = .RelPermalink -}}
|
||||
{{- end -}}
|
||||
{{- with $image -}}
|
||||
{{- if $image | or (gt (len $matches) 0) -}}
|
||||
<div class="featured-image-preview">
|
||||
<a href="{{ $.RelPermalink }}" aria-label="{{ $.Title }}">
|
||||
{{- $optim := slice
|
||||
@@ -20,7 +17,7 @@
|
||||
(dict "Process" "fill 1200x360 Center webp q75" "descriptor" "1200w")
|
||||
(dict "Process" "fill 1600x480 Center webp q75" "descriptor" "1600w")
|
||||
-}}
|
||||
{{- dict "Src" . "Title" $.Title "Resources" $.Resources "Loading" "eager" "Width" "800" "Height" "240" "Sizes" "(max-width: 680px) 100vw, (max-width: 960px) 80vw, (max-width: 1440px) 56vw, 800px" "OptimConfig" $optim "Alt" (printf "Featured image for %v" $.Title) | partial "plugin/image.html" -}}
|
||||
{{- dict "Src" $image "Title" $.Title "Resources" $.Resources "Matches" $matches "Loading" "eager" "Width" "800" "Height" "240" "Sizes" "(max-width: 680px) 100vw, (max-width: 960px) 80vw, (max-width: 1440px) 56vw, 800px" "OptimConfig" $optim "Alt" (printf "Featured image for %v" $.Title) | partial "plugin/image.html" -}}
|
||||
</a>
|
||||
</div>
|
||||
{{- end -}}
|
||||
|
||||
Reference in New Issue
Block a user