The Hoof & Paw
DocsCategoriesTagsView the current conditions from the WolfspyreLabs WeatherstationToggle Dark/Light/Auto modeToggle Dark/Light/Auto modeToggle Dark/Light/Auto modeBack to homepage

Native Shortcodes

Hugo has several built-in shortcodes.

Lets go over them here:

Gist
Takes the user and gist ID as parameters and renders a GitHub gist. You can also pass a filename if the gist has multiple files.

Ref
Takes a file path in the Hugo website and provides an absolute link to that file. If the url or slug is overridden in the front matter of a page, the ref shortcode follows the newly provided location.

[Neat]({{</* ref "blog/neat.md" */>}})

results in:

<a href="https://example.com/blog/neat"> Neat <//a>

Relref
Provides the relative link to the file in the Hugo website.

This shortcode works similar to ref.

[Who]({{</* relref “about.md#who” */>}})

results in:

<a href="https://example.com/about#who">who</</a> 

Figure
Renders an image with a caption.
Example here

Tweet
Renders a Tweet with the given ID.
Example Here

Instagram
Embeds an Instagram image with the given ID.
Example here

Vimeo
Renders a Vimeo video with the given ID.
example here

Youtube
Renders a YouTube video with the given ID.
example here

Highlight
Adds syntax highlighting for the provided source code.

Param
Prints a passed parameter (useful for debugging purposes as well).
example here