Shortcode vs Partials

Shortcode and Partials

Both are reusable html code that can be used in your hugo site.

Shortcode is for FrontMatter (or markdown files), where as Partials can be used in layouts, other partials and short codes.

Shortcode

To include a Markdown shortcode in a page, use the name of the shortcode file, in between double curly braces and percent characters, {{% SHORTCODE %}}. To use myshortcode.md add the below snippet to Markdown page.

Markdown Shortcodes

 {{% myshortcode %}}

HTML Shortcodes

 {{< myshortcode >}}

Partials

Partials are reusable html blocks (typically html files), that you can use from short code or another partial or layout file.

Typical example include header.html , footer.html.

{{partial "my-custom-banner.html" .}}

Scenerio

Ok, tell me where I am supposed to use a short code? Well, think about this - mark down file contains markdown syntax and you would want to render some awesome card. How would you create it?

• You want to render some html markup in front matter (.md files)
• You want to reuse some custom html block in more than one place, for eg Subscribe to our mailing thread kind of input box.

The above input box is a short code and reuse it in all my markdown pages.

How can I reuse code between shortcode and partials?

As I mentioned you can not use a shortcode in partials, but you can do vice versa. So if you ever wanted to reuse code, create a partial and include it in shortcode.