hextra/exampleSite/content/docs/guide/shortcodes/_index.md

---
title: Shortcodes
weight: 9
prev: /docs/guide/diagrams
next: /docs/guide/shortcodes/callout
---

[Hugo Shortcodes](https://gohugo.io/content-management/shortcodes/) are simple snippets inside your content files calling built-in or custom templates.

Hextra provides a collection of beautiful shortcodes to enhance your content.

{{< cards >}}
  {{< card link="callout" title="Callout" icon="warning" >}}
  {{< card link="cards" title="Cards" icon="card" >}}
  {{< card link="details" title="Details" icon="chevron-right" >}}
  {{< card link="filetree" title="FileTree" icon="folder-tree" >}}
  {{< card link="icon" title="Icon" icon="badge-check" >}}
  {{< card link="steps" title="Steps" icon="one" >}}
  {{< card link="tabs" title="Tabs" icon="collection" >}}
{{< /cards >}}

<div style="padding-top:4rem"></div>

Additional shortcodes provided by Hugo and Hextra:

{{< cards >}}
  {{< card link="jupyter" title="Jupyter Notebook" icon="jupyter" tag="alpha" >}}
  {{< card link="others" title="Others" icon="view-grid" >}}
  {{< card link="hextra" title="Hextra" icon="view-grid" >}}
{{< /cards >}}