Gallery Shortcode results in rebuild error

[ryvaeus]

Hi Will, I'm trying to use your gallery shortcode but end up getting an assembly error:

Change detected, rebuilding site.
2023-07-21 12:49:11.915 -0700
DEBUG Rebuild for events ["WRITE         \"D:\\\\ryvaeus.com\\\\content\\\\blog\\\\test.md\""]
DEBUG cachebuster: Matching "content/blog/test.md" with source "assets/.*\\.(js|ts|jsx|tsx)": no match
DEBUG cachebuster: Matching "content/blog/test.md" with source "assets/.*\\.(css|sass|scss)$": no match
DEBUG cachebuster: Matching "content/blog/test.md" with source "(postcss|tailwind)\\.config\\.js": no match
DEBUG cachebuster: Matching "content/blog/test.md" with source "assets/.*\\.(.*)$": no match
Source changed WRITE         "D:\\ryvaeus.com\\content\\blog\\test.md"
INFO  build: running step "process" duration "2.1104ms"
INFO  build: running step "assemble" duration "3.0898ms"
ERROR Rebuild failed: assemble: "D:\ryvaeus.com\content\blog\test.md:1:1": unclosed shortcode
Total in 5 ms

The only thing in my test.md is

---
title: Testing gallery shortcode
date: 2023-07-21T19:48:30.130Z
description: Not sure how it works.
categories:
  - thoughts
tags:
  - tech
series: []
---
{{< paige/gallery align="start" >}}
{{< paige/image height="20rem" src="1-2.jpg" >}}
{{< paige/image height="10rem" src="2-2.jpg" >}}
{{< /paige/gallery />}}

The above gallery shortcode comes directly from your gallery shortcode example page

[willfaught]

See https://willfaught.com/paige/shortcodes/gallery/#figure. You have to close the image shortcode with / at the end:

{{< paige/image src="1-2.jpg" />}}

[ryvaeus]

Hello Will,

Thanks for the suggestion! I closed the image shortcodes, however it still errors on rebuilding:

Change detected, rebuilding site.
2023-07-22 00:22:11.760 -0700
DEBUG Rebuild for events ["WRITE         \"D:\\\\ryvaeus.com\\\\content\\\\blog\\\\test.md\""]
DEBUG cachebuster: Matching "content/blog/test.md" with source "assets/.*\\.(js|ts|jsx|tsx)": no match
DEBUG cachebuster: Matching "content/blog/test.md" with source "assets/.*\\.(css|sass|scss)$": no match
DEBUG cachebuster: Matching "content/blog/test.md" with source "(postcss|tailwind)\\.config\\.js": no match
DEBUG cachebuster: Matching "content/blog/test.md" with source "assets/.*\\.(.*)$": no match
Source changed WRITE         "D:\\ryvaeus.com\\content\\blog\\test.md"
INFO  build: running step "process" duration "1.5537ms"
INFO  build: running step "assemble" duration "6.2265ms"
ERROR Rebuild failed: assemble: "D:\ryvaeus.com\content\blog\test.md:11:1": failed to extract shortcode: shortcode ">}}" does not evaluate .Inner or .InnerDeindent, yet a closing tag was provided
Total in 9 ms

This is the contents of test.md:

---
title: Testing gallery shortcode
description: Not sure how it works.
---
{{< paige/gallery align="start" >}}
{{< paige/image height="20rem" src="1-2.jpg" />}}
{{< paige/image height="10rem" src="2-2.jpg" />}}
{{< /paige/gallery />}}

I'm getting the same error whether one, the other, or both of the image shortcodes are closed.

This is my version and vendor info:
hugo v0.115.2-8966424e0e521fb1627216a84efd2c5d5917cb0d+extended windows/amd64 BuildDate=2023-07-08T17:06:56Z VendorInfo=gohugoio

[willfaught]

You made the closing gallery tag self-closing, which is invalid:

{{< /paige/gallery />}}

Remove the last /.

When in doubt, I suggest starting with the example code, and adjusting it to your needs.

[ryvaeus]

You made the closing gallery tag self-closing, which is invalid:

{{< /paige/gallery />}}

Remove the last /.

When in doubt, I suggest starting with the example code, and adjusting it to your needs.

Oh I see! Thank you very much.

As I mentioned in the opening post, I did use your example code directly from your shortcode page. It appears under the "Align" example (which you can see is what I had used as a demo) the sample closing gallery tags are self-closed. I had no idea that was invalid code.

However, even removing the last / resulted in a rebuild error.

What ended up working was removing that final /, and also removing the closing / from both image shortcodes inside the gallery shortcodes. The final functional code looks like this:

---
title: Testing gallery shortcode
description: Not sure how it works.
draft: true
---
{{< paige/gallery align="start" >}}
{{< paige/image height="20rem" src="1-2.jpg" >}}
{{< paige/image height="10rem" src="2-2.jpg" >}}
{{< /paige/gallery >}}

And just to compare, this is the code currently displayed in your example page:

{{< paige/gallery align="start" >}}
{{< paige/image height="20rem" src="1-2.jpg" >}}
{{< paige/image height="10rem" src="2-2.jpg" >}}
{{< /paige/gallery />}}

Thank you for leading me in the right direction!

[ryvaeus]

Just wanted to point out as it's related, but the sample code given in the gallery figure section also is resulting in the same problem with the same solution; simply removing the self-closing slashes from all of the lines of the paige/figure and paige/image tags gets it all working in the end.

Original sample code:

{{< paige/figure caption="Gallery" />}}
{{< paige/gallery >}}
{{< paige/figure caption="Image 1" />}}
{{< paige/image src="1-2.jpg" />}}
{{< /paige/figure >}}
{{< paige/figure caption="Image 2" />}}
{{< paige/image src="2-2.jpg" />}}
{{< /paige/figure >}}
{{< paige/figure caption="Image 3" />}}
{{< paige/image src="3.jpg" />}}
{{< /paige/figure >}}
{{< paige/figure caption="Image 4" />}}
{{< paige/image src="4.jpg" />}}
{{< /paige/figure >}}
{{< /paige/gallery >}}
{{< /paige/figure >}}

Working code:

{{< paige/figure caption="Gallery" >}}
{{< paige/gallery >}}
{{< paige/figure caption="Image 1" >}}
{{< paige/image src="1-2.jpg" >}}
{{< /paige/figure >}}
{{< paige/figure caption="Image 2" >}}
{{< paige/image src="2-2.jpg" >}}
{{< /paige/figure >}}
{{< paige/figure caption="Image 3" >}}
{{< paige/image src="3.jpg" >}}
{{< /paige/figure >}}
{{< paige/figure caption="Image 4" >}}
{{< paige/image src="4.jpg" >}}
{{< /paige/figure >}}
{{< /paige/gallery >}}
{{< /paige/figure >}}

Hope this helps someone else down the line!

[willfaught]

I see, I misunderstood your first post. My apologies for the mix-up. This is indeed a problem with the documentation. I've fixed it in v0.64.1, which is now deployed live. Thank you for your report!