74 lines
4.7 KiB
Text
74 lines
4.7 KiB
Text
|
{{- $original_img := (.Page.Resources.ByType "image").GetMatch (printf "*%s" (.Get "src")) -}}
|
||
|
|
||
|
{{- $alt := "" -}}{{ if isset .Params "alt" }}{{ $alt = .Get "alt" | safeHTML }}{{ end }}
|
||
|
{{- $title := "" -}}{{ if isset .Params "title" }}{{ $title = .Get "title" | safeHTML }}{{ end }}
|
||
|
{{- $link := "" -}}{{ if isset .Params "link" }}{{ $link = (.Get "link") }}{{ end }}
|
||
|
{{- $caption := "" -}}{{ if isset .Params "caption" }}{{ $caption = (.Get "caption" | markdownify ) }}{{ end }}
|
||
|
{{- $float := "" -}}{{ if isset .Params "float" }}{{ $float = .Get "float" | default "" }}{{ end }}
|
||
|
{{- $width := "" -}}{{ if isset .Params "width" }}{{ $width = .Get "width" | default $original_img.Width }}{{ end }} <!-- wenn width angegeben, dann nur in der größe einbinden und kein srcset -->
|
||
|
|
||
|
{{- if and (lt $width $original_img.Width ) ( $width ) -}}
|
||
|
{{- $original_img = $original_img.Resize (printf "%dx webp" (int $width)) -}}
|
||
|
{{- end -}}
|
||
|
<!--{{- if and (not $original_img) .Page.File -}}
|
||
|
{{- $path := path.Join .Page.File.Dir .Destination -}}
|
||
|
{{- $original_img = resources.Get $path -}}
|
||
|
{{- end -}}-->
|
||
|
|
||
|
{{- with $original_img -}}
|
||
|
{{- $image_webp_360 := "" -}}
|
||
|
{{- $image_webp_500 := "" -}}
|
||
|
{{- $image_webp_816 := "" -}}
|
||
|
{{- $image_webp_1632 := "" -}}
|
||
|
{{- $image_webp_full := "" -}}
|
||
|
|
||
|
{{- $image_jpg_360 := "" -}}
|
||
|
{{- $image_jpg_500 := "" -}}
|
||
|
{{- $image_jpg_816 := "" -}}
|
||
|
{{- $image_jpg_1632 := "" -}}
|
||
|
{{- $image_jpg_full := "" -}}
|
||
|
|
||
|
{{- if ge $original_img.Width 816 -}}
|
||
|
{{- $image_jpg_360 = $original_img.Resize "360x jpg" -}}
|
||
|
{{- $image_jpg_500 = $original_img.Resize "500x jpg" -}}
|
||
|
{{- $image_jpg_816 = $original_img.Resize "816x jpg" -}}
|
||
|
|
||
|
{{- $image_webp_360 = $original_img.Resize "360x webp" -}}
|
||
|
{{- $image_webp_500 = $original_img.Resize "500x webp" -}}
|
||
|
{{- $image_webp_816 = $original_img.Resize "816x webp" -}}
|
||
|
|
||
|
{{- if gt $original_img.Width 1632 -}}
|
||
|
{{- $image_jpg_1632 = $original_img.Resize "1632x jpg" -}}
|
||
|
{{- $image_webp_1632 = $original_img.Resize "1632x webp" -}}
|
||
|
{{- end -}}
|
||
|
{{- else -}} <!-- Bilder sind kleiner als 816, die _full brauchen wir nur dann zum Direkteinbinden. -->
|
||
|
{{ if ne $original_img.MediaType.SubType "webp" -}}
|
||
|
{{- $image_webp_full = $original_img.Resize (printf "%dx webp" $original_img.Width) -}}
|
||
|
{{- end -}}
|
||
|
|
||
|
{{ if ne $original_img.MediaType.SubType "jpeg" -}}
|
||
|
{{- $image_jpg_full = $original_img.Resize (printf "%dx jpg" $original_img.Width) -}}
|
||
|
{{- end -}}
|
||
|
{{- end -}}
|
||
|
|
||
|
<figure class="image-caption {{- with $float }} float-{{.}}{{- end -}}">
|
||
|
{{- if ge $original_img.Width 816 -}}
|
||
|
{{- if ( $link ) -}}<a href="{{- $link -}}">{{- end -}}<picture>
|
||
|
<source type="image/webp" srcset="{{ $image_webp_360.RelPermalink }} 360w, {{- $image_webp_500.RelPermalink }} 500w, {{- $image_webp_816.RelPermalink }} 816w {{- with $image_webp_1632 -}}, {{ .RelPermalink }} 1632w{{- end -}}"
|
||
|
sizes="(max-width: 424px) 360px, (max-width: 596px) 500px, (min-width: 565px) 816px {{- if gt $original_img.Width 1632 -}},(min-width: 1200px) 1632px{{- end -}}" />
|
||
|
<img alt="{{- $alt -}}" srcset="{{ $image_jpg_360.RelPermalink }} 360w, {{ $image_jpg_500.RelPermalink }} 500w, {{ $image_jpg_816.RelPermalink }} 816w {{- with $image_jpg_1632 -}},{{ .RelPermalink }} 1632w{{- end -}}"
|
||
|
sizes="(max-width: 424px) 360px, (max-width: 596px) 500px, (min-width: 565px) 816px {{- if gt $original_img.Width 1632 -}},(min-width: 1200px) 1632px{{- end -}}"
|
||
|
src="{{ with $image_jpg_816 -}}{{ .RelPermalink }}{{- end -}}" title="{{- $title -}}" loading="lazy" width="{{- $image_jpg_816.Width -}}" height="{{- $image_jpg_816.Height -}}" />
|
||
|
{{- else -}}
|
||
|
{{- if ( $link ) -}}<a href="{{- $link -}}">{{- end -}}
|
||
|
<picture><source type="image/webp" srcset="{{- if eq .MediaType.SubType "webp" -}}{{ $original_img.RelPermalink }}{{- else -}}{{ $image_webp_full.RelPermalink }}{{- end -}}" />
|
||
|
<img alt="{{- $alt -}}" src="{{- if eq .MediaType.SubType "jpeg" -}}{{ $original_img.RelPermalink }}{{- else -}}{{ $image_jpg_full.RelPermalink }}{{- end -}}" title="{{- $title -}}" width="{{- $original_img.Width -}}" height="{{- $original_img.Height -}}" loading="lazy" />
|
||
|
{{- end -}}
|
||
|
</picture>{{- if ( $link ) -}}</a>{{- end -}}
|
||
|
{{- if ( $caption ) -}}<figcaption>{{- with $caption -}}{{.}}{{- end -}}</figcaption>{{- end -}}</figure>
|
||
|
{{- else -}}
|
||
|
{{- if ( $link ) -}}<a href="{{- $link -}}">{{- end -}}
|
||
|
<img src="{{ .Destination | safeURL }}" alt="{{ $.Text }}" title="{{- with $.Title | safeHTML }}{{ . }}{{ end -}}" loading="lazy" />
|
||
|
{{- if ( $link ) -}}</a>{{- end -}}
|
||
|
{{- end -}}
|