Hugo Canonical

Page content

A canonical URL is the URL of the best representative page from a group of duplicate pages, according to Google. For example, if you have two URLs for the same page (such as example.com?dress=1234 and example.com/dresses/1234), Google chooses one as canonical. Similarly, if you have multiple pages that are nearly identical, Google can group them together (for example, pages that differ only by the sorting or filtering of the contents, such as by price or item color) and choose one as canonical. Google can only index the canonical URL from a set of duplicate pages.

A duplicate can be in a different domain than its canonical (such as example.com/mypage and example2.com/myduplicate).

Prepare Folder

change to your Hugo Root Folder (where the config.toml remains)

mkdir -p layouts/partials/

Build Header File

cat << 'EOF' > layouts/partials/header.html
<header class="header">
	<div class="container header__container">
		{{ partial "logo.html" . }}
		{{ partial "menu.html" . }}
	</div>
  <script defer language="javascript" type="text/javascript"  src="{{ "/js/copy-code.js" | urlize | relURL }}"></script>
  {{ if .Params.canonicalUrl }}
  <link rel="canonical" href="{{ .Params.canonicalUrl }}">
  {{ else }}
  <link rel="canonical" href="{{ .RelPermalink }}">
  {{ end }}
</header>
EOF

Build Page

hugo

and then, check your webpage if you find something like this in the Source View:

  <link rel="canonical" href="/posts/hugo_canonical/">

Any Comments ?

sha256: 782a8934b74a55d22fa4e627e596c8bcda2558e7c0a7674e3ac3ad216bf94696