A bit more precision regarding Shortcodes


Newbie here, discovered Hugo a few days ago.
So far so good, I’m working on a customization of the mainroad theme before providing actual content (can see it right here on http://loneworg.com ).

Now I wanted to do something quite simple : after implementing the FancyBox JS to display the images in a nice pop-in, I wanted to make a shortcode to call for that.

Basically I wanted to call the image with something like :

{{< loneimg https://cdn.pbrd.co/images/m1kAHMe1g.jpg >}}

So simply using the img url as an argument here.
However I struggled doing that and ended up using this instead :

{{< loneimg m1kAHMe1g >}}

With :

<a class="fancybox" href="https://cdn.pbrd.co/images/{{ index .Params 0 }}.jpg"><img src="https://cdn.pbrd.co/images/{{ index .Params 0 }}.jpg" /></a>

As my custom shortcode.

So my remarks are:

  1. Are there any forbidden caracters for a shortcode variable ? Cuz it seems like it, and if so I think it would be nice mentioning that in the documentation (maybe I missed it ??)
  2. Also regarding the documentation it says :

To create a shortcode, place a template in the layouts/shortcodes directory.

I think it would be nice here to mention that this is the “layouts” directory from the root folder, not the directory that can be found in most themes. May sound obvious for certain but as a noob I lost time with that.

  1. Unquoted it must be alphanumeric with a few additions (to make it YouTube compliant).
  2. Quoted it can be anything.

Themes can also have shortcodes, but we could maybe make this clearer in the doc. Pull requests with improvements are always welcome.

Thanks for the quick reply. I am not sure of where the quotes apply here, as in my 1st attempt I had the following :

<a class="fancybox" href="{{ index .Params 0 }}"><img src="{{ index .Params 0 }}" /></a>

And from what I remember the HTML generated stopped right after the href param.
But maybe you are talking about quotes in the shortcode call and not in the definition ?

Regarding the pulling request, still need to familiarize with git ;).


Awesome, will try that, thanks !