Setting up a simple Blog with a Static Website Generator - Part 8: Hugo Taxonomies

Mon Dec 28, 2015

Draft - Raw, Un-edited


2. Tweaked config.yaml to add tags taxonomy and Permalinks

By default the template already included categories taxonomy

$ git diff config.yaml
diff --git a/config.yaml b/config.yaml
index d8bb4b7..2689cb1 100644
--- a/config.yaml
+++ b/config.yaml
@@ -1,9 +1,15 @@
+canonifyurls: true
 contentdir: "content"
 layoutdir: "layouts"
 publishdir: "public"
   category: "categories"
-baseurl: ""
+  tag: "tags"
+baseurl: ""
 title: "Hugo Blog Template for GitHub Pages"
+  posts: "/:year/:month/:day/:title/"
+languageCode: "en-us"
+  name: "Jeffrey Liu"

Added layouts/chrome/tags.html

  This file is a template that is included various places to have a list of
  that particular posts categories generated.
<div class="container">
  <ul class="catlist">
    <li><em>Tags: </em></li>
    {{ range .Params.tags }}
      <li><a href="/tags/{{ . | urlize }}">{{ . }}</a> </li>
    {{ end }}

Added layouts/indexes/tag.html

  This file is used to render a list of all posts that belong to a specific

{{ template "chrome/header.html" . }}

  {{ template "chrome/sidebar.html" . }}

    Taken from Lanyon example site.

    Putting everything in the wrap div makes the whole page slide over when the
    navigation button is pressed.

    The masthead is a special Lanyon class that is above the horizontal line at
    the top of each page. To me it seemed like a place to put the page title.

    We want the title to be Blog Posts and we want it to be a link to the
    root of the /posts section of the site.

  <div class="wrap">
    <div class="masthead">
      <div class="container">
        <h3 class="masthead-title">
          <a href="/" title="Home">Home</a>

  <!-- Show summary of all posts in a tag -->
    <div class="container content">
      <h1 class="post-title">Content Tags</h1>
        <section id="main">
            <h5><a href="/tags">Full Tags Index</a></h5>
            <h2>Posts in &ldquo;{{ .Title }}&rdquo;</h2>
            {{ range .Data.Pages }}
            {{ .Render "summary"}}
            {{ end }}


  <label for="sidebar-checkbox" class="sidebar-toggle"></label>

  <!-- Include footer (ends <body> and <html>) -->
  {{ template "chrome/footer.html" }}