Skip to main content

Shortcodes

Use Hugo shortcodes within your markdown files to quickly build pages.

Alerts

The alert shortcode creates an alert block that can be used to display notices or warnings.

{{% alert color="warning" icon="warning" %}}
A simple warning alert—check it out!
{{% /alert %}}

Messages

This is a message.
{{% message color="primary" icon="info" %}}
This is a message.
{{% /message %}}

Tabbed panes

TypeScript is great!
Swift is awesome!
React is wonderful!



{{< tabpane text=true >}}
{{< tab header="TypeScript" >}}
TypeScript is great!
{{< /tab >}}
{{< tab header="Swift" >}}
Swift is awesome!
{{< /tab >}}
{{< tab header="React" >}}
React is wonderful!
{{< /tab >}}
{{< /tabpane >}}

Code Examples

{{< tabpane text=true >}}
{{< tab header="TypeScript" >}}
TypeScript is great!
{{< /tab >}}
{{< tab header="Swift" >}}
Swift is awesome!
{{< /tab >}}
{{< tab header="React" >}}
React is wonderful!
{{< /tab >}}
{{< /tabpane >}}