How to generate a list of clickable tags?

support
1

I’m a little bit ashamed asking for something this basic, but how can I make a list of clickable tags for a post? (which I intend to place in the theme’s single.html file, just below the post).

The documentation provides this example:

<ul id="tags">
  {{ range .Params.tags }}
    <li><a href="tags/{{ . | urlize }}">{{ . }}</a> </li>
  {{ end }}
</ul>

With that, however, I get tag links in the following format:

localhost/category-name/post-name/tags/tag-name

(relative links (i.e., ../tags/) gave the same output).

I tried using the .BaseUrl variable to arrive at the correct tag links (localhost/tags/tag-name) like this:

{{ range .Params.tags }}
  <li><a href="{{ .Site.BaseUrl }}/tags/{{ . | urlize }}">{{ . }}</a> </li>
{{ end }}

But with this Hugo throws an <.Site.BaseUrl>: can't evaluate field Site in type string error (v0.14). I did define, by the way, the baseurl variable in config.toml.

1 Like
2

Try:

{{$.Site.BaseUrl }}

And this is FAR FROM a stupid question. This is one of the main gotchas with Go templates. The “.” context changes; inside the .Params.tags range, the “.” is now the tag name.

$. is a reference to the top-level node. An alternative would be to save either that node or the baseURL into a variable and use that later.

{{ $baseURL := .Site.BaseUrl }}
1 Like
3

Thanks Bep, with the $ sign in front it works correctly.

For other beginners, here’s how I implemented it now:

<ul id="tags-single">
  <li>Tags:</li>
  {{ range .Params.tags }}
    <li><a href="{{ $.Site.BaseUrl }}tags/{{ . | urlize }}">{{ . }}</a> </li>
  {{ end }}
</ul>
4

As an update, I got this error just now ERROR: 2015/07/23 Site's .BaseUrl is deprecated and will be removed in Hugo 0.15. Use .BaseURL instead., and have changed the code as follows:

<ul id="tags-single">
  <li>Tags:</li>
  {{ range .Params.tags }}
    <li><a href="{{ $.Site.BaseURL }}tags/{{ . | urlize }}">{{ . }}</a> </li>
  {{ end }}
</ul>
1 Like
5

Another option is to just use relative URLs – then enable canonifyURLs in site config.

6

And then the relative URLs will be rewritten to absolute ones by Hugo, right?

The [documentation][1] is, the way I read it, not very clear about this:

# enable this to make all relative URLs relative to content root. Note that this does not affect absolute URLs.
relativeURLs:       false
canonifyURLs:               false

I’m not sure what “enable this” refers to; the first statement following the comment or both? I guess they are exclusive (one off, the other on), or should I only add one to the config file?
[1]: http://gohugo.io/overview/configuration/

7

canonifyURLs (default false) => relative URLs becomes absolute, using the BaseURL setting to do so.
relativeURLs (default false) => if true then it overrides any canonifyURLs setting. This is a special case setting that should maybe have been named less confusing :slight_smile: Typical use case is having a site on a shared file folder where a BaseURL doesn’t make any sense. “/animage.jpg” in “/blog/index.html” becomes “…/animage.jpg” etc.