Redo the figure shortcode to take multiple images
Put all images in a flexbox container
This commit is contained in:
parent
cce2a1670e
commit
afc6e81b70
2 changed files with 41 additions and 11 deletions
|
@ -1,11 +1,36 @@
|
|||
{{- $img := (.Page.Resources.GetMatch (.Get "name")) -}}
|
||||
{{- $resized_img := $img.Fit "1280x1280" -}}
|
||||
{{- $altText := $img.Params.alt | default $img.Title -}}
|
||||
{{- $imgs := slice -}}
|
||||
|
||||
{{- if .Get "name" -}}
|
||||
{{- $imgs = $imgs | append (.Page.Resources.GetMatch (.Get "name")) -}}
|
||||
{{- else if .Get "names" -}}
|
||||
{{- range (split (.Get "names") ",") -}}
|
||||
{{- $imgs = $imgs | append ($.Page.Resources.GetMatch .) -}}
|
||||
{{- end -}}
|
||||
{{- else -}}
|
||||
{{ errorf "Missing name or names parameter to figures/image" }}
|
||||
{{- end -}}
|
||||
|
||||
{{- if lt (len $imgs) 0 -}}
|
||||
{{ errorf "No images found for name(s) parameter" }}
|
||||
{{- end -}}
|
||||
|
||||
{{- $shouldShowTitle := (.Get "shouldShowTitle") | default true -}}
|
||||
|
||||
<figure>
|
||||
<a href="{{ $img.RelPermalink }}">
|
||||
<img src="{{ $resized_img.RelPermalink }}"{{ with $altText}} alt="{{ . }}"{{ end }}>
|
||||
</a>
|
||||
{{ if $img.Title }}
|
||||
<figcaption>{{ $img.Title }}</figcaption>
|
||||
{{ end }}
|
||||
<div class=container>
|
||||
{{ range $img := $imgs -}}
|
||||
{{- $resizedImg := $img.Fit "1280x1280" -}}
|
||||
{{- $altText := $img.Params.alt | default $img.Title -}}
|
||||
<a href="{{ $img.RelPermalink }}">
|
||||
<img src="{{ $resizedImg.RelPermalink }}"
|
||||
{{- with $altText }} alt="{{ . }}"{{- end }}
|
||||
{{- with $img.Title }} title="{{ . }}"{{- end }}>
|
||||
</a>
|
||||
{{- end }}
|
||||
</div>
|
||||
{{ if and $shouldShowTitle -}}
|
||||
{{- range $imgs -}}
|
||||
<figcaption>{{ .Title }}</figcaption>
|
||||
{{- end -}}
|
||||
{{- end }}
|
||||
</figure>
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue