If you like blogging like me, you probably post your content on multiple places. For example, I post my content on xebia.com, conijn.io and dev.to. When you do not provide a canonical url search engines like Google are less likely to show your blog.
What is a canonical URL
I describe a canonical url the same way as you do other source disclosures. For example, when you publish your blog on site A. This would be the original content. By posting it on site B you are duplicating the content. Since you are the author that is all fine. But the search engine does not know this. So by pointing to the source, the search engines know what page they should recommend.
How can you use a canonical URL
There are 2 relatively easy ways to set a canonical url. Via a header or using a html tag. For example the headers of your website request could return:
Link: <https://xebia.com/blog/why-should-i-set-a-canonical-url/>; rel="canonical"
For this method you need control over how the headers are generated. The other method is simpler, using a html tag:
<link rel="canonical" href="https://xebia.com/blog/why-should-i-set-a-canonical-url"/>
The reason why I like this method, is because it is easy to setup using Hugo.
What is Hugo?
According to the website:
Hugo is one of the most popular open-source static site generators. With its amazing speed and flexibility, Hugo makes building websites fun again.
Hugo uses simple Markdown files as input and renders a complete static website out of that. So you will have a single markdown file for your blog.
Setup a canonical URL in Hugo
Each post is a separate markdown file, so you can define some metadata using front-matter. In this metadata you can also add the canonical url:
---
author: Joris Conijn
canonicalUrl: https://xebia.com/blog/why-should-i-set-a-canonical-url/
categories:
- Blog
date: 2023-05-10 00:00:00+00:00
excerpt: Learn why you should set a canonical url when you do cross-posting of your
blogs.
featured_image: images/banner.jpg
focus-keywords: set canonical url
slug: why-should-i-set-a-canonical-url
subtitle: ''
title: Why should I set a canonical URL?
---
If you like blogging like me, you probably post your content on multiple places. For example, I post my content on [xebia.com](https://xebia.com/blog), [conijn.io](https://conijn.io/blog/) and [dev.to](https://dev.to/aws-builders). When you do not provide a canonical url search engines like Google are less likely to show your blog.
...
Next, you need to specify in the layout of your site where the canonical url used. I have placed it in the baseof.html
file of my layout as followed:
{{ if .Params.canonicalUrl }}
<link rel="canonical" href="{{ .Params.canonicalUrl }}">
{{ else }}
<link rel="canonical" href="{{ .Permalink }}">
{{ end }}
This will point the page to itself if no canonical is set. But if it is set it points to the provided url.
Conclusion
Setting the canonical url can improve the likelihood of your page being found. And when you use Hugo it is easy to put in place!
Photo by Brett Sayles