Add srcset support to figure and img shortcodes.

This commit is contained in:
Fredrik Jonsson 2021-06-23 10:17:53 +02:00
commit a292f0f9fe
2 changed files with 22 additions and 2 deletions

View file

@ -7,6 +7,8 @@
{{ $link := .Get "link" -}}
{{ $size := .Get "size" -}}
{{ $src := .Get "src" -}}
{{ $srcset := .Get "srcset" -}}
{{ $srcsetw := (slice) }}
{{ $title := .Get "title" -}}
{{ $width := .Get "width" -}}
{{ $maxwidth := .Site.Params.imageMaxWidth -}}
@ -24,6 +26,14 @@
{{ $realwidth = $original.Width -}}
{{ $realheight = $original.Height -}}
{{ end -}}
{{ if $srcset -}}
{{ range $set := split $srcset " " -}}
{{ $image := $original.Resize (printf "%sx" $set) -}}
{{ $srcsetw = $srcsetw | append (printf "%s %sw" $image.RelPermalink $set) }}
{{ end }}
{{ $width = "" -}}
{{ $height = "" -}}
{{ end -}}
{{ else if and $src (fileExists (add "/static" $src)) -}}
{{ with (imageConfig (add "/static" $src)) -}}
{{ $realwidth = .Width -}}
@ -54,7 +64,7 @@
{{ end -}}
<figure class="image{{ with $class }} {{ . }}{{ end }}">
{{ with $link }}<a href="{{ . }}">{{ end -}}
<img src="{{ $src }}"{{ with $alt }} alt="{{ . }}"{{ end }}{{ with $width }} width="{{ . }}"{{ end }}{{ with $height }} height="{{ . }}"{{ end }}>
<img src="{{ $src }}"{{ with $srcsetw }} srcset="{{ delimit . ", " }}"{{ end }}{{ with $alt }} alt="{{ . }}"{{ end }}{{ with $width }} width="{{ . }}"{{ end }}{{ with $height }} height="{{ . }}"{{ end }}>
{{- if $link }}</a>{{ end }}
{{ if or $title $caption $attr -}}
<figcaption>

View file

@ -4,6 +4,8 @@
{{ $link := .Get "link" -}}
{{ $size := .Get "size" -}}
{{ $src := .Get "src" -}}
{{ $srcset := .Get "srcset" -}}
{{ $srcsetw := (slice) }}
{{ $width := .Get "width" -}}
{{ $maxwidth := .Site.Params.imageMaxWidth -}}
{{ $realwidth := 0 -}}
@ -20,6 +22,14 @@
{{ $realwidth = $original.Width -}}
{{ $realheight = $original.Height -}}
{{ end -}}
{{ if $srcset -}}
{{ range $set := split $srcset " " -}}
{{ $image := $original.Resize (printf "%sx" $set) -}}
{{ $srcsetw = $srcsetw | append (printf "%s %sw" $image.RelPermalink $set) }}
{{ end }}
{{ $width = "" -}}
{{ $height = "" -}}
{{ end -}}
{{ else if and $src (fileExists (add "/static" $src)) -}}
{{ with (imageConfig (add "/static" $src)) -}}
{{ $realwidth = .Width -}}
@ -49,5 +59,5 @@
{{ $height = (math.Round $height) -}}
{{ end -}}
{{ with $link }}<a class="image-link" href="{{ . }}">{{ end -}}
<img class="image{{ with $class }} {{ . }}{{ end }}" src="{{ $src }}"{{ with $alt }} alt="{{ . }}"{{ end }}{{ with $width }} width="{{ . }}"{{ end }}{{ with $height }} height="{{ . }}"{{ end }}>
<img class="image{{ with $class }} {{ . }}{{ end }}" src="{{ $src }}"{{ with $srcsetw }} srcset="{{ delimit . ", " }}"{{ end }}{{ with $alt }} alt="{{ . }}"{{ end }}{{ with $width }} width="{{ . }}"{{ end }}{{ with $height }} height="{{ . }}"{{ end }}>
{{- if $link }}</a>{{ end }}