If you’re looking to improve your SEO one of the first things you want to do is add metadata like the meta description and keywords to your site. I was trying to figure out how to do it with Hugo and the Hyde-Hyde theme I’m using and couldn’t find anything in the documentation about it. Others have done it by modifying or creating Hugo template files, however before going down that path I realised there’s actually an easier way when digging into the Hyde-Hyde theme.
Looking at the header file in my themes directory themes/hyde-hyde/layouts/partials/header.html I noticed it was referencing the meta.html file:
{{ partial "header/meta.html" . }}
In that meta.html file we see the following near the bottom:
{{ with .Site.Params.meta.description }}<meta name="description" content="{{ . }}">{{ end }}
{{ with .Site.Params.meta.keywords }}<meta name="keywords" content="{{.}}">{{ end }}
Interesting, I couldn’t find any of that in the documentation. So instead of me customising things too much, all I have to do to set the meta description and keywords for the site is to set those params in my config.toml configuration file:
[params.meta]
description = "Passing on my learnings about data, streaming, automation and SD-WAN so you don't have to waste as many hours as I did trying to figure out how to make it work."
keywords = "data, data streaming, data analysis, automation, sd-wan, splunk, signalfx, hugo, riverbed, netlify, brocade"
Well that wasn’t too bad, hopefully it saves you some time in case you’re looking to do something similar!