diff options
| author | Sebastian Pech <windows@spech.de> | 2018-10-30 21:47:39 +0300 |
|---|---|---|
| committer | Sebastian Pech <windows@spech.de> | 2018-10-30 21:47:39 +0300 |
| commit | 3f12624707bac9e5d965941971fccd280b14dc2d (patch) | |
| tree | a7b06d619d3a3888febb273a973f80db0b6ecd62 | |
| parent | bded4bec3bc111fc28abc973a52fbce2ae9c7fe3 (diff) | |
Shortcode added
| -rw-r--r-- | exampleSite/content/post/005-theme-info/index.md | 4 | ||||
| -rw-r--r-- | layouts/shortcodes/optfigure.html | 37 |
2 files changed, 41 insertions, 0 deletions
diff --git a/exampleSite/content/post/005-theme-info/index.md b/exampleSite/content/post/005-theme-info/index.md index 561cf67..3dbd182 100644 --- a/exampleSite/content/post/005-theme-info/index.md +++ b/exampleSite/content/post/005-theme-info/index.md @@ -17,6 +17,8 @@ categories: ## Headline 2 +The header image is automatically added if there is a file called `*feature*` or `*cover*`. The first wildcard is prefered over the second one. If there are multiple images the first one is used. + Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. ### Headline 3 @@ -43,6 +45,8 @@ var config = { } ``` +{{< optfigure src="cover-home-office-599475_1920" class="figure" title="Home office" caption="This is the home office caption. The image is resized automatically using `optfigure` shortcode." >}} + Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. | Test | More test | diff --git a/layouts/shortcodes/optfigure.html b/layouts/shortcodes/optfigure.html new file mode 100644 index 0000000..0f2194c --- /dev/null +++ b/layouts/shortcodes/optfigure.html @@ -0,0 +1,37 @@ +{{ $original := .Page.Resources.GetMatch (printf "*%s*.{png,jpg}" (.Get "src")) }} +{{ $alt := (.Get "alt") }} +{{ $caption := (.Get "caption") }} + +<figure{{ with .Get "class" }} class="{{ . }}"{{ end }}> + {{- if .Get "link" -}} + <a href="{{ .Get "link" }}"{{ with .Get "target" }} target="{{ . }}"{{ end }}{{ with .Get "rel" }} rel="{{ . }}"{{ end }}> + {{- end }} +{{ with $original }} + {{ if gt $original.Width 600 }} + {{ $image := .Resize "600x" }} + <img src="{{ $image.RelPermalink }}" width="{{ $image.Width }}" height="{{ $image.Height }}" + {{- if or ($alt) ($caption) }} + alt="{{ with $alt }}{{ . }}{{ else }}{{ $caption | markdownify| plainify }}{{ end }}" + {{- end -}} + /> + {{ else }} + <img src="{{ $original.RelPermalink }}" width="{{ $original.Width }}" height="{{ $original.Height }}" /> + {{ end }} +{{ end }} + {{- if .Get "link" }}</a>{{ end -}} + {{- if or (or (.Get "title") (.Get "caption")) (.Get "attr") -}} + <figcaption class="figure-caption"> + {{ with (.Get "title") -}} + <h4>{{ . }}</h4> + {{- end -}} + {{- if or (.Get "caption") (.Get "attr") -}}<p> + {{- .Get "caption" | markdownify -}} + {{- with .Get "attrlink" -}} + <a href="{{ . }}"> + {{- end -}} + {{- .Get "attr" | markdownify -}} + {{- if .Get "attrlink" }}</a>{{ end }}</p> + {{- end }} + </figcaption> + {{- end }} +</figure> |