Rockingcool
/
paige-hugo
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Separate gallery and image shortcodes

Browse Source
master
Will Faught 2 years ago
parent 665f5e2955
commit 95cf4cfb82
3 changed files with 115 additions and 159 deletions
Show Stats Download Patch File Download Diff File

84
exampleSite/content/shortcodes/gallery/index.md
Unescape Escape View File

@ -213,14 +213,14 @@ Code:
```go-text-template ```go-text-template
{{</* paige/gallery caption="1 image" */>}} {{</* paige/gallery caption="1 image" */>}}
{{</* paige/gallery image="*-1*.jpg" caption="Image 1" /*/>}} {{</* paige/image src="*-1*.jpg" /*/>}}
{{</* /paige/gallery */>}} {{</* /paige/gallery */>}}
``` ```
Result: Result:
{{< paige/gallery caption="1 image" >}} {{< paige/gallery caption="1 image" >}}
{{< paige/gallery image="*-1*.jpg" caption="Image 1" />}} {{< paige/image src="*-1*.jpg" >}}
{{< /paige/gallery >}} {{< /paige/gallery >}}
--- ---
@ -229,16 +229,16 @@ Code:
```go-text-template ```go-text-template
{{</* paige/gallery caption="2 images" */>}} {{</* paige/gallery caption="2 images" */>}}
{{</* paige/gallery image="*-2*.jpg" caption="Image 1" /*/>}} {{</* paige/image src="*-2*.jpg" /*/>}}
{{</* paige/gallery image="*-3*.jpg" caption="Image 2" /*/>}} {{</* paige/image src="*-3*.jpg" /*/>}}
{{</* /paige/gallery */>}} {{</* /paige/gallery */>}}
``` ```
Result: Result:
{{< paige/gallery caption="2 images" >}} {{< paige/gallery caption="2 images" >}}
{{< paige/gallery image="*-2*.jpg" caption="Image 1" />}} {{< paige/image src="*-2*.jpg" >}}
{{< paige/gallery image="*-3*.jpg" caption="Image 2" />}} {{< paige/image src="*-3*.jpg" >}}
{{< /paige/gallery >}} {{< /paige/gallery >}}
--- ---
@ -247,18 +247,18 @@ Code:
```go-text-template ```go-text-template
{{</* paige/gallery caption="3 images" */>}} {{</* paige/gallery caption="3 images" */>}}
{{</* paige/gallery image="*-4*.jpg" caption="Image 1" /*/>}} {{</* paige/image src="*-4*.jpg" /*/>}}
{{</* paige/gallery image="*-5*.jpg" caption="Image 2" /*/>}} {{</* paige/image src="*-5*.jpg" /*/>}}
{{</* paige/gallery image="*-6*.jpg" caption="Image 3" /*/>}} {{</* paige/image src="*-6*.jpg" /*/>}}
{{</* /paige/gallery */>}} {{</* /paige/gallery */>}}
``` ```
Result: Result:
{{< paige/gallery caption="3 images" >}} {{< paige/gallery caption="3 images" >}}
{{< paige/gallery image="*-4*.jpg" caption="Image 1" />}} {{< paige/image src="*-4*.jpg" >}}
{{< paige/gallery image="*-5*.jpg" caption="Image 2" />}} {{< paige/image src="*-5*.jpg" >}}
{{< paige/gallery image="*-6*.jpg" caption="Image 3" />}} {{< paige/image src="*-6*.jpg" >}}
{{< /paige/gallery >}} {{< /paige/gallery >}}
--- ---
@ -267,20 +267,20 @@ Code:
```go-text-template ```go-text-template
{{</* paige/gallery caption="4 images" */>}} {{</* paige/gallery caption="4 images" */>}}
{{</* paige/gallery image="*-7*.jpg" caption="Image 1" /*/>}} {{</* paige/image src="*-7*.jpg" /*/>}}
{{</* paige/gallery image="*-8*.jpg" caption="Image 2" /*/>}} {{</* paige/image src="*-8*.jpg" /*/>}}
{{</* paige/gallery image="*-9*.jpg" caption="Image 3" /*/>}} {{</* paige/image src="*-9*.jpg" /*/>}}
{{</* paige/gallery image="*-10.jpg*" caption="Image 4" /*/>}} {{</* paige/image src="*-10.jpg*" /*/>}}
{{</* /paige/gallery */>}} {{</* /paige/gallery */>}}
``` ```
Result: Result:
{{< paige/gallery caption="4 images" >}} {{< paige/gallery caption="4 images" >}}
{{< paige/gallery image="*-7*.jpg" caption="Image 1" />}} {{< paige/image src="*-7*.jpg" >}}
{{< paige/gallery image="*-8*.jpg" caption="Image 2" />}} {{< paige/image src="*-8*.jpg" >}}
{{< paige/gallery image="*-9*.jpg" caption="Image 3" />}} {{< paige/image src="*-9*.jpg" >}}
{{< paige/gallery image="*-10.jpg*" caption="Image 4" />}} {{< paige/image src="*-10.jpg*" >}}
{{< /paige/gallery >}} {{< /paige/gallery >}}
--- ---
@ -289,22 +289,22 @@ Code:
```go-text-template ```go-text-template
{{</* paige/gallery caption="5 images" */>}} {{</* paige/gallery caption="5 images" */>}}
{{</* paige/gallery image="*-11*.jpg" caption="Image 1" /*/>}} {{</* paige/image src="*-11*.jpg" /*/>}}
{{</* paige/gallery image="*-12*.jpg" caption="Image 2" /*/>}} {{</* paige/image src="*-12*.jpg" /*/>}}
{{</* paige/gallery image="*-13*.jpg" caption="Image 3" /*/>}} {{</* paige/image src="*-13*.jpg" /*/>}}
{{</* paige/gallery image="*-14*.jpg" caption="Image 4" /*/>}} {{</* paige/image src="*-14*.jpg" /*/>}}
{{</* paige/gallery image="*-15*.jpg" caption="Image 5" /*/>}} {{</* paige/image src="*-15*.jpg" /*/>}}
{{</* /paige/gallery */>}} {{</* /paige/gallery */>}}
``` ```
Result: Result:
{{< paige/gallery caption="5 images" >}} {{< paige/gallery caption="5 images" >}}
{{< paige/gallery image="*-11*.jpg" caption="Image 1" />}} {{< paige/image src="*-11*.jpg" >}}
{{< paige/gallery image="*-12*.jpg" caption="Image 2" />}} {{< paige/image src="*-12*.jpg" >}}
{{< paige/gallery image="*-13*.jpg" caption="Image 3" />}} {{< paige/image src="*-13*.jpg" >}}
{{< paige/gallery image="*-14*.jpg" caption="Image 4" />}} {{< paige/image src="*-14*.jpg" >}}
{{< paige/gallery image="*-15*.jpg" caption="Image 5" />}} {{< paige/image src="*-15*.jpg" >}}
{{< /paige/gallery >}} {{< /paige/gallery >}}
--- ---
@ -313,24 +313,24 @@ Code:
```go-text-template ```go-text-template
{{</* paige/gallery caption="6 images" */>}} {{</* paige/gallery caption="6 images" */>}}
{{</* paige/gallery image="*-16*.jpg" caption="Image 1" /*/>}} {{</* paige/image src="*-16*.jpg" /*/>}}
{{</* paige/gallery image="*-17*.jpg" caption="Image 2" /*/>}} {{</* paige/image src="*-17*.jpg" /*/>}}
{{</* paige/gallery image="*-18*.jpg" caption="Image 3" /*/>}} {{</* paige/image src="*-18*.jpg" /*/>}}
{{</* paige/gallery image="*-19*.jpg" caption="Image 4" /*/>}} {{</* paige/image src="*-19*.jpg" /*/>}}
{{</* paige/gallery image="*-20*.jpg" caption="Image 5" /*/>}} {{</* paige/image src="*-20*.jpg" /*/>}}
{{</* paige/gallery image="*-21*.jpg" caption="Image 6" /*/>}} {{</* paige/image src="*-21*.jpg" /*/>}}
{{</* /paige/gallery */>}} {{</* /paige/gallery */>}}
``` ```
Result: Result:
{{< paige/gallery caption="6 images" >}} {{< paige/gallery caption="6 images" >}}
{{< paige/gallery image="*-16*.jpg" caption="Image 1" />}} {{< paige/image src="*-16*.jpg" >}}
{{< paige/gallery image="*-17*.jpg" caption="Image 2" />}} {{< paige/image src="*-17*.jpg" >}}
{{< paige/gallery image="*-18*.jpg" caption="Image 3" />}} {{< paige/image src="*-18*.jpg" >}}
{{< paige/gallery image="*-19*.jpg" caption="Image 4" />}} {{< paige/image src="*-19*.jpg" >}}
{{< paige/gallery image="*-20*.jpg" caption="Image 5" />}} {{< paige/image src="*-20*.jpg" >}}
{{< paige/gallery image="*-21*.jpg" caption="Image 6" />}} {{< paige/image src="*-21*.jpg" >}}
{{< /paige/gallery >}} {{< /paige/gallery >}}
<div class="text-center">Photos by <a href="https://unsplash.com/@photos_by_lanty">Lanty</a>.</div> <div class="text-center">Photos by <a href="https://unsplash.com/@photos_by_lanty">Lanty</a>.</div>

4
layouts/partials/paige/style.html
Unescape Escape View File

@ -47,6 +47,10 @@ body, html {
margin-bottom: 0; margin-bottom: 0;
} }
.paige-gallery .paige-image {
margin-bottom: 0;
}
.paige-figure .paige-image { .paige-figure .paige-image {
margin-bottom: 0; margin-bottom: 0;
} }

50
layouts/shortcodes/paige/gallery.html
Unescape Escape View File

@ -1,7 +1,6 @@
{{ $align := .Get "align" | default "center" }} {{ $align := .Get "align" | default "center" }}
{{ $caption := .Get "caption" }} {{ $caption := .Get "caption" }}
{{ $height := .Get "height" }} {{ $height := .Get "height" }}
{{ $image := .Get "image" }}
{{ $images := .Get 0 | default (.Get "images") }} {{ $images := .Get 0 | default (.Get "images") }}
{{ $justify := .Get "justify" | default "center" }} {{ $justify := .Get "justify" | default "center" }}
{{ $maxwidth := .Get "maxwidth" }} {{ $maxwidth := .Get "maxwidth" }}
@ -9,55 +8,9 @@
{{ $number := .Get "number" }} {{ $number := .Get "number" }}
{{ $numbered := .Get "numbered" }} {{ $numbered := .Get "numbered" }}
{{ $options := .Get "options" | default "550x webp picture Lanczos" }} {{ $options := .Get "options" | default "550x webp picture Lanczos" }}
{{ $raw := .Get "raw" }}
{{ $type := .Get "type" | default "rows" }} {{ $type := .Get "type" | default "rows" }}
{{ $width := .Get "width" }} {{ $width := .Get "width" }}
{{ if $image }}
{{ $link := $image }}
{{ $resource := "" }}
{{ if not $raw }}
{{ $resource = partial "paige/resource.html" (dict
"page" .Page
"url" $image
) }}
{{ $link = $resource.RelPermalink }}
{{ end }}
{{ if $caption }}
{{ partial "paige/image-figure.html" (dict
"caption" $caption
"compact" true
"gap" 2
"height" $height
"link" $link
"maxwidth" $maxwidth
"method" $method
"options" $options
"page" .Page
"raw" $raw
"resource" $resource
"src" $image
"table" true
"width" $width
) }}
{{ else }}
{{ partial "paige/a.html" (dict
"content" (partial "paige/img.html" (dict
"class" "img-fluid"
"height" $height
"maxwidth" $maxwidth
"method" $method
"options" $options
"resource" $resource
"src" $image
"width" $width
))
"href" $link
) }}
{{ end }}
{{ else }}
{{ $inner := chomp .Inner }} {{ $inner := chomp .Inner }}
{{ $resources := slice }} {{ $resources := slice }}
{{ $showcaption := $caption }} {{ $showcaption := $caption }}
@ -89,7 +42,7 @@
{{ end }} {{ end }}
{{ end }} {{ end }}
<figure> <figure class="paige-gallery">
{{ if eq $type "grid" }} {{ if eq $type "grid" }}
<div class="container-fluid px-0"> <div class="container-fluid px-0">
<div class="align-items-{{ $align }} gx-3 gy-3 justify-content-{{ $justify }} row row-cols-1 row-cols-sm-2 row-cols-md-3 row-cols-lg-4 row-cols-xl-5 row-cols-xxl-6"> <div class="align-items-{{ $align }} gx-3 gy-3 justify-content-{{ $justify }} row row-cols-1 row-cols-sm-2 row-cols-md-3 row-cols-lg-4 row-cols-xl-5 row-cols-xxl-6">
@ -143,4 +96,3 @@
<figcaption class="figure-caption mt-2 text-center">{{ $caption }}</figcaption> <figcaption class="figure-caption mt-2 text-center">{{ $caption }}</figcaption>
{{ end }} {{ end }}
</figure> </figure>
{{ end }}

Write Preview
Loading…
Cancel
Save