[Solved] Cannot Get Parameter in Shortcode

For CSS purposes I have set a parameter in a post’s front matter

layout = "complex"

Inside the figure shortcode I am trying to set a class like so:

<figure{{ if isset .Params "layout" }}{{ with .Params.layout }}class="{{ . }}"{{ end }}{{ end }}>

But it doesn’t work. I have also tried different variations like

<figure{{ if isset .Params "layout" }}{{ with .Get "layout"}} class="{{ . | plainify }}"{{ end }}{{ end }}>

But it doesn’t work.
I managed to set the class at some point but then page goes 404 without Hugo server throwing any errors.

Also I changed the name of the parameter from layout to something else. In that case the page doesn’t go 404 but still I cannot get the parameter and set the class on the figure and I can’t figure out why…

I am using the latest Hugo Snap in Ubuntu.

I haven’t tried it myself, but have you tried something like:

<figure{{ if isset .Params "layout" }} class="{{ .Params.layout | plainify }}"{{ end }}>

Nope. It doesn’t work. It’s a bit bizarre.

It gives me a 404 again.

I just want to say that I styled the figure element by targeting it in another way.

But still I would really like to know what’s causing the syntax to fail, for educational purposes.

If I call the front matter parameter as layout =.... Hugo server shows no errors in the terminal when building the site but a 404 error is thrown when visiting the page where the shortcode is displayed.

And if I name the parameter into something other than layout the figure element never gets the class I want.

@alexandros Do you have an html template called complex.html in your layouts directory? layout has specific meaning in Hugo related to type

  1. You can also try adding $.Page to get a higher scope, but I think you are getting an issue because .Params is a different context.
  2. You also don’t need to use both isset and with together. Using with checks for a set variable and then rebinds the context…

Nope. I don’t have a complex.html.

I kind of suspected that something goes on layout. That’s what caused the 404.

I will try your other suggestions and get back to you.


To clarify, use {{ with $.Page.Params.yourparam}}{{.}}{{end}}.

If you want to make it really flexible, you might also consider using a named parameter that’s added directly to the shortcode rather than pulling from a level up (i.e., the metadata/front matter of the content file). You can then use the .Get method instead. This is pretty well battled tested with some of the embedded shortcodes…

{{with .Get "namedparam"}}{{.}}{{end}}


1 Like

I use isset to apply a class to figure only if the parameter exists . Just to keep my html clean.

Now that WORKS. Thanks a lot @rdwatters .

Here is the working snippet for anyone who needs something like this.

<figure{{ if isset .Page.Params "complex" }} class="{{ with $.Page.Params.complex}}{{.}}{{end}}"{{end}}>

Also I understand your point about adding a named parameter directly in the shortcode. But I also need to set this class on another element in the content page.

Glad it’s working, but the above doesn’t make sense. Put the with before the class attribute and remove the isset…

I stand corrected. Thnx.

1 Like

@alexandros. That probably seemed snarkier than intended. That’s what I get for doing so much Hugo-isn’t from my phone :smile: Cheers!

1 Like