Shortcodes

Shortcodes are simple snippets inside your content files calling built-in or custom templates.

Shortcodes markup

A shortcode is constituted of a name, attributes and content. Here is what a shortcode looks like:

{% shortcode_name myattr="value" otherattr="value2" %}

some content

{% endshortcode_name %}

Full shortcodes

Here is an example of the alert shortcode which makes use of attributes and content.

Input

{% alert type="warning" title="Be careful" %}

Be careful while driving!

{% endalert %}

Output

Be careful

Be careful while driving!

Shortcodes without content

Some shortcodes don't need any content, such as the youtube shortcode which renders a youtube player for a given video. With this kind of shortcode, there is no need for the closing tag (no {% endyoutube %} tag needed).

{% youtube id="M7lc1UVf-VE" %}

Which renders:

Some shortcodes only make use of content. Here is an example of the subtitle shortcode rendering the subtitle of this same page.

{% subtitle %}

Shortcodes are simple snippets inside your content files calling built-in or custom templates.

{% endsubtitle %}

Which renders:

Shortcodes are simple snippets inside your content files calling built-in or custom templates.

Builtin shortcodes

Alert

Display various alert types.

Attributes

AttributeDescriptionDefault
typeAlert type used to style the background color and the icon. Can be one of note, info, tip, summary, question, success, warning, error.note
titleTitle of the alert.Uppercased type

Examples

Info alert

Input

{% alert type="info" title="New version" %}

A new version of this API is available

{% endalert %}

Output

New version

A new version of this API is available

Warning alert

Input

{% alert type="warning" title="Be careful" %}

Be careful while crossing the road!

{% endalert %}

Output

Be careful

Be careful while crossing the road!


Gist

Display a Gist.

Attributes

AttributeDescriptionDefault
idGist identifier (:owner/:hash)none

Examples

Gist

Input

{% gist id="mattallty/63c395f500732d6f0efc339aae28bcab" %}

Output

Subtitle

Display a subtitle, to be used under h1 headings.

Attributes

This shortcode does not accept any attribute.

Examples

Subtitle

Input

<h1>My title</h1>

{% subtitle %}

This is my subtitle.

{% endsubtitle %}

Output

My title

This is my subtitle.

Twitter

TWitter card

Youtube

Edit this page / submit change