Add paige/figure shortcode

master
Will Faught 3 years ago
parent b1495c89c0
commit 7652ade1bb

@ -449,6 +449,33 @@ title: Search
---
```
## Figures
The `paige/figure` shortcode provides a figure with a centered image and an optional centered caption.
The image and caption can optionally be displayed inline instead of centered.
The image has optional alt, title, width, and height attributes,
and can optionally be wrapped in an anchor. Only the image source parameter is required.
These are the named parameters with positions, listed in the order of their positions:
```go
{{< paige/figure
src="https://imgs.xkcd.com/comics/sandwich.png"
link="https://xkcd.com/149"
caption="My caption"
alt="My alt"
title="My title" >}}
```
These are the rest of the named parameters:
```go
{{< paige/figure
height=500
inline=false
width=500 >}}
```
## Customization
If `partials/paige-head-last.html` exists in the site, it is included at the end of the head tag.

@ -0,0 +1,13 @@
<figure {{ if eq (.Get `inline`) true }} class="figure"{{ else }} class="align-items-center d-flex flex-column"{{ end }}>
{{ $link := .Get 1 | default (.Get `link`) }}
{{ with $link }}
<a href="{{ . }}">
{{ end }}
<img{{ with (.Get 3 | default (.Get `alt`)) }} alt="{{ . }}"{{ end }} class="figure-img img-fluid"{{ with .Get `height` }} height="{{ . }}"{{ end }} src="{{ .Get 0 | default (.Get `src`) }}"{{ with (.Get 4 | default (.Get `title`)) }} title="{{ . }}"{{ end }}{{ with .Get `width` }} width="{{ . }}"{{ end }}>
{{ if $link }}
</a>
{{ end }}
{{ with (.Get 2 | default (.Get `caption`)) }}
<figcaption class="figure-caption">{{ . }}</figcaption>
{{ end }}
</figure>
Loading…
Cancel
Save