Add Meta Description To Your Hugo Posts For SEO

SEO is important if you want people to find your articles on Google. This is a simple way to make sure you have a custom meta description for each article you publish.


Meta description

The meta description is probably the hardest part of writing a good article. It’s probably the most important, as it is the only content they will come in contact with before opening your article.

meta description

Adding a custom meta description to your posts

Let’s start by adding a custom site-wide summary that will show if you don’t specify anything for your posts. This will go into config.toml.

[params]
    description = "This is the fallback description if nothing is specified"

Let’s also add a description for each new article you write, it should look like this

author: "..."
title: "..."
date: ...
description: "Post specific meta description"

The last part is adding the content to head. This can be done by either modifying the theme files or overwriting the file ourselves. The last one is probably the best as we don’t have to mess with the theme files.

Copy the file

themes/your-theme/layouts/partials/head.html

to the following path

layouts/partials/head.html

This will create a file that will override the theme file, which you can modify without affecting the theme files. Add the following line to include the meta description or the site-wide description if nothing else is specified.

<meta
    name="description"
    content="{{ if .Params.description }}{{ .Params.description }}{{ else if .Site.Params.Description }}{{ .Site.Params.Description }}{{ end }}"
/>