See also
- layouts/shortcodes
- head.html for adding the css and js required some of these shortcodes.
Embeds a file from github within a code block.
Can highlight lines etc...
{{<github repo="username/repo-name" file="/path/to/file" lang="language" options="highlight-options">}}
See hugh/highlight-shortcode for options.
e.g.
{{<github repo="sammcj/smcleod" file="layouts/shortcodes/github.html" lang="language" options="linenos=table,hl_lines=2 5-6,linenostart=2">}}
In head.html:
{{ if .HasShortcode "github_button" }}
<script async defer src="{{ .Site.BaseURL }}js/buttons.js"></script>
{{ end }}
Site config.toml:
[params.HugoShortcodes.Github]
User = 'your_github_login_or_org_name'
Repository = 'your_repository_name'
Usage:
{{< github-button button="follow" user="sammcj" >}}
{{< github-button button="sponsor" user="sammcj" >}}
{{< github-button button="watch" user="sammcj" repo="github-button-hugo-shortcode" count="true" >}}
{{< github-button button="star" user="sammcj" repo="github-button-hugo-shortcode" count="true" >}}
{{< github-button button="fork" user="sammcj" repo="github-button-hugo-shortcode" count="true" >}}
{{< github-button button="template" user="sammcj" repo="github-button-hugo-shortcode" >}}
{{< github-button button="issue" user="sammcj" repo="github-button-hugo-shortcode" count="true" >}}
{{< github-button button="download" user="sammcj" repo="github-button-hugo-shortcode" >}}
Table of contents for a page that has toc disabled.
{{<toc>}}
Embeds a youtube playlist.
{{<youtubepl id="PL4cUxeGkcC9gcy9lrvMJ75z9maRw4byYp">}}
Embeds an asciinema recording.
{{<asciinema id="123456">}}
Embeds an emoji.
{{<emoji name="smile">}}
Embeds a colour swatch.
{{<colour name="red" hex="#ff0000">}}
Highlights words.
Highlight {{< highlighter color="lime" >}}absolutely **any** words {{</ highlighter >}} you want.
Embeds a static Toot from a Mastodon instance.
{{< tootstatic "aus.social" "108739791879133672" >}}
Embeds a live Toot from a Mastodon instance.
---
> {{<tootonline "https://aus.social/@s_mcleod/108739791879133672">}}
---
Embeds a youtube video.
{{<youtubelite videoId="RcXstZ4FzyE">}}
Code with tabs, good for showing different languages.
{{< tabs groupId="config" >}}
{{% tab name="json" %}}
\```json
{
"Hello": "World"
}
\```
{{% /tab %}}
{{% tab name="XML" %}}
\```xml
<Hello>World</Hello>
\```
{{% /tab %}}
{{% tab name="properties" %}}
\```properties
Hello = World
\```
{{% /tab %}}
{{< /tabs >}}
## image-gallery.html
Embeds a gallery of images with thumbnails.
```hugo
{{< image-gallery gallery_dir="dir-with-images" >}}