Switch branches/tags
Nothing to show
Find file Copy path
Fetching contributors…
Cannot retrieve contributors at this time
79 lines (62 sloc) 3.2 KB

+++ categories = ["English", "hugo"] date = "2016-03-22" publishdate = "2016-03-22" draft = false tags = ["go", "hugo", "shortcodes", "lightbox", "boilerplate"] title = "Lightbox Gallery Shortcodes"

+++ In order to get the old wordpress posts image gallery to work (like [CPH:Triathlon]({{< relref "" >}})) I decided to take on some shortcodes. They look very much Jinja Macros which I know from my $dayjob - which might turn out to be a bit confusing.

In essence my plan was to avoid too much boilerplate. At first i tried generalizing the wordpress markup into a shortcode but I found it a bit hard to get working. I didn't want to write lots of tags, I didn't want to repeat the images declaration with and without the thumbnail size suffix (example: img-150x150.png)


In the end I ended up with a frontmatter flag: {{< gist svrist 9749757e1db524da7933 >}} which enabled the inclusion of the javascript etc. in the header.

And two shortcodes. A wrapping one that defines the prefix path of the images for the gallery and the number of columns.

{{< gist svrist c6a87ac6e60302de606b >}}

And a shortcode for each of the images inside of the gallery: {{< gist svrist 23f468bf9bf87dec3c3d >}}

In use it looks like this: {{< gist sbv-csis "250ae9e9124176181a53" >}}

Looking at it afterwards it doesn't seem of much, but during, I had to get acquainted with many concepts. Two things stands out:

Nested shortcodes

In order to actually propagate the variables from the wrapping/outer shortcode and into the wrapped shortcodes I turned to the forums for help. It turns out that it wasn't available in hugo just as of yet - but before my replace .Inner "PREFIX" (.Get "prefix") hack was done bep had already merged a solution - I guess it will be available in upcomming 0.16 release. It works by allowing the nested shortcodes to access the parent shortcode context via .Parent.Get "var".

When release my replace will go away and galleryimage will instead of PREFIX have:

src="{{ $.Parent.Get "prefix" }}/{{ . }}-{{ $size }}.{{ $suffix }}" 

Default value for missing variables

In jinja | default is pretty normal order of business. As I again consulted the forums it turned out hugo had been looking for a solution to that problem as well. Again in short order a solution was proposed, reviewed and merged.

When that is released my or .Get "something" "other" will be replaced with

.Get "something" | default "other"

All in all the community and response was pretty awesome. Highly recommended :)