Tag Cloud


#1

I searched for “tag cloud”, and assumed I could find some good examples, but no …

So I made it myself:

See it in action here:

http://themes.gohugo.io/


Creating costum taxonomy template
#2

Thanks so much for this. Other solutions I’ve seen were JS based.

And of course it’s much better and faster to render tags directly from the template.


Adding content for taxonomies
#3

Please let me introduce a simple & elegant solution for a tag-cloud based on scss.

You can see that in action at the bottom of this page : https://www.bullion-investor.com/report/


=== tagcloud.scss ===

@for $i from 2 through 1000 {
    @if $i <= 20 { $size: 1em + ( 2 / 20 ) * $i; }
    @if $i >  20 { $size: 3em; }
    .font_size_#{$i} { font-size: $size; }
}

=== layout index.html ===

{{ with .Site.Taxonomies.tag }}
    <h1 class="list_title"><a href="{{ $baseUrl }}tag/">Tags</a></h1>
    <section class="taxonomy">
        {{ range $key, $value := . }}
        <span class="tag">
            <a href="{{ $baseUrl }}tag/{{ $key | urlize }}/" class="font_size_{{ .Count }}">
                {{ $key }}
            </a>
        </span>
        {{ end }}
    </section>
{{ end }}