mirror of
https://github.com/hugo-fixit/FixIt.git
synced 2026-08-24 15:28:57 +00:00
91 lines
4.5 KiB
HTML
91 lines
4.5 KiB
HTML
{{- /*
|
|
The image plugin is a partial that handles image resources.
|
|
|
|
Parameters:
|
|
- Src: The path to the image.
|
|
It can be a page resource (inside a page bundle) https://gohugo.io/methods/page/resources/
|
|
or a global resource (inside the assets directory) https://gohugo.io/functions/resources/get/
|
|
or a link to a remote resource, which can be cached if the site parameter is set https://gohugo.io/functions/resources/getremote/
|
|
- Resources: If the image is a page resource, this parameter is required. It is the .Resources of the page.
|
|
- OptimConfig: optimisation parameter, defined like
|
|
{{- $optim := slice
|
|
(dict "Process" "resize 800x Center webp q75" "descriptor" "800w")
|
|
(dict "Process" "resize 1200x Center webp q75" "descriptor" "1200w")
|
|
(dict "Process" "resize 1600x Center webp q75" "descriptor" "1600w")
|
|
-}}
|
|
See https://gohugo.io/content-management/image-processing/ for more information.
|
|
- Alt: alt text for the image. https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#alt
|
|
- Height: The intrinsic height of the image, in pixels. Must be an integer without a unit.
|
|
We try to generate this value automatically if possible. https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#height
|
|
- Width: The intrinsic width of the image, in pixels. Must be an integer without a unit.
|
|
We try to generate this value automatically if possible. https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#width
|
|
- 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.
|
|
|
|
Thanks @HEIGE-PCloud for the original code in the DoIt theme.
|
|
https://github.com/HEIGE-PCloud/DoIt/blob/main/layouts/partials/plugin/image.html
|
|
*/ -}}
|
|
|
|
{{- $isInline := strings.HasPrefix .Src "data:image" -}}
|
|
{{- $isRemote := urls.Parse .Src | partial "function/is-url-remote.html" -}}
|
|
{{- $resource := dict -}}
|
|
|
|
{{- if not $isRemote | and (not $isInline) -}}
|
|
{{- $resource = (.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 -}}
|
|
|
|
{{- if not $resource | and $isRemote | and $cacheRemote -}}
|
|
{{- with try (resources.GetRemote .Src) -}}
|
|
{{- with .Err -}}
|
|
{{- warnf "%s" . -}}
|
|
{{- else with .Value -}}
|
|
{{- if .ResourceType | eq "image" -}}
|
|
{{- /* placed remote image in public/images/remote/ */ -}}
|
|
{{- $resource = . | resources.Copy (add "/images/remote/" .Name) -}}
|
|
{{- end -}}
|
|
{{- else -}}
|
|
{{- warnf "Unable to get remote image %q" .Src -}}
|
|
{{- end -}}
|
|
{{- end -}}
|
|
{{- end -}}
|
|
|
|
{{- $isSvg := false -}}
|
|
{{- if $resource -}}
|
|
{{- $isSvg = (eq $resource.MediaType.SubType "svg") -}}
|
|
{{- end -}}
|
|
|
|
{{- $optim := .OptimConfig -}}
|
|
{{- $srcset := "" -}}
|
|
{{- if $optim | and $resource | and $optimise | and (not $isSvg) -}}
|
|
{{ $srcsetSlice := slice -}}
|
|
{{- range $optim -}}
|
|
{{- if .Process -}}
|
|
{{- $processed := $resource.Process .Process -}}
|
|
{{- $srcsetSlice = $srcsetSlice | append (printf "%s %s" $processed.RelPermalink .descriptor) -}}
|
|
{{- end -}}
|
|
{{- end -}}
|
|
{{- $srcset = delimit $srcsetSlice ", " -}}
|
|
{{- end -}}
|
|
|
|
{{- $src := $resource.RelPermalink | default .Src -}}
|
|
{{- $alt := .Alt | default $src -}}
|
|
{{- $caption := .Caption | default $alt -}}
|
|
{{- $height := .Height -}}
|
|
{{- $width := .Width -}}
|
|
{{- if not $isSvg -}}
|
|
{{- $height = $height | default $resource.Height | default "" -}}
|
|
{{- $width = $width | default $resource.Width | default "" -}}
|
|
{{- end -}}
|
|
|
|
{{- if .Linked -}}
|
|
<a class="lightgallery" href="{{ $src }}" title="{{ .Title | default $alt }}" data-thumbnail="{{ $src }}"{{ with $caption }} data-sub-html="<h2>{{ . }}</h2>{{ with $.Title }}<p>{{ . }}</p>{{ end }}"{{ end }}{{ with .Rel }} rel="{{ . }}"{{ end }}>
|
|
{{- end -}}
|
|
<img {{- with .Class }} class="{{ . }}"{{ end }}{{ with .Loading }} loading="{{ . }}"{{ end }} {{ printf "src='%v'" $src | safeHTMLAttr }}{{ with $srcset }} srcset="{{ . }}"{{ end }}{{ with .Sizes }} sizes="{{ . }}"{{ end }}{{ with $alt }} alt="{{ . }}"{{ end }}{{ with $height }} height="{{ . }}"{{ end }}{{ with $width }} width="{{ . }}"{{ end }}{{ with .Decoding }} decoding="{{ . }}"{{ end }}{{ with .Referrerpolicy }} referrerpolicy="{{ . }}"{{ end }}>
|
|
{{- if .Linked -}}
|
|
</a>
|
|
{{- end -}}
|