Hugo - Shorten Markdown Header Anchor Links
Markdown Header Anchor Links h2 to h6
Hugo creates automatically from the title text when generating. A trick can be used to shorten the title length for the link. Shorter links are good for SEO.
In my post “Hugo - Create optical header anchor links automatically” I - Anchor Links - described in more detail. Hugo replaces spaces from the header title with hyphens, but country-specific special characters are included in the anchor link.
The tip
The Markdown header, for example for h2
, is used according to the pattern ## title
. You can influence the text of the anchor link according to the pattern ## title {#anchorlink}
. The id
of the HTML tag h2
is changed by the {#anchorlink}
.
The following is a Markdown example:
## A really, really long title with no sense {#very-long-title}
The result is:
<h2 id="very-long-title">A really, really long title with no sense</h2>
Conclusion
Through this very simple possibility, the header anchor link can be shortened manually in a SEO-compliant manner.
This might also interest you
- Hugo - Create optical header anchor links automatically
Through a Markdown render hook, create optical header anchor links automatically.
- Hugo - Adjust the URL with the Front Matter variable slug
Create SEO compatible URL with the Hugo Front Matter variable slug.
- Hugo - Canonical Pagination Links for Blog Posts and Tags
Canonical links for pagination pages - page/2, page/3 ...
With the German language setting, comments are not displayed in the English version of the website and vice versa.