Chapter 3

Shortcodes

Hugo uses Markdown for its simple content format. However, there are a lot of things that Markdown doesn’t support well. You could use pure HTML to expand possibilities.

But this happens to be a bad idea. Everyone uses Markdown because it’s pure and simple to read even non-rendered. You should avoid HTML to keep it as simple as possible.

To avoid this limitations, Hugo created shortcodes. A shortcode is a simple snippet inside a page.

The Relearn theme provides multiple shortcodes on top of existing ones.

Attachments

The Attachments shortcode displays a list of files attached to a page

Button

Nice buttons on your page

Children

List the child pages of a page

Expand

Displays an expandable/collapsible section of text on your page

Include

Displays content from other Markdown files

Mermaid

Generation of diagram and flowchart from text in a similar manner as Markdown

Notice

Disclaimers to help you structure your page

Site param

Get value of site params variables in your page

Swagger

Adds UI for your Swagger / OpenAPI Specifications

Tabbed views

Synchronize selection of content in different tabbed views