Introduce Badge shortcode

This commit is contained in:
Alex Shpak
2025-08-04 01:17:28 +02:00
parent 2b0d7ffa26
commit 470d619e1d
6 changed files with 101 additions and 21 deletions
@@ -0,0 +1,29 @@
# Badges
{{< badge title="Title" value="Value" >}}
{{< badge style="info" title="Hugo" value="0.147.6" >}}
{{< badge style="success" title="Build" value="Passing" >}}
{{< badge style="warning" title="Coverage" value="25%" >}}
{{< badge style="danger" title="Issues" value="120" >}}
Badges can be used to annotate your pages with additional information or mark specific places in markdown content.
## Examples
| Shortcode | Output |
| -- | -- |
| `{{</* badge style="info" title="hugo" value="0.147.6" */>}}` | {{< badge style="info" title="Hugo" value="0.147.6" >}} |
| `{{</* badge style="success" title="Build" value="Passing" */>}}` | {{< badge style="success" title="Build" value="Passing" >}} |
| `{{</* badge style="warning" title="Coverage" value="25%" */>}}` | {{< badge style="warning" title="Coverage" value="25%" >}} |
| `{{</* badge style="danger" title="Issues" value="120" */>}}` | {{< badge style="danger" title="Issues" value="120" >}} |
| | |
| `{{</* badge style="info" title="Title" */>}}` | {{< badge style="info" title="Title" >}} |
| `{{</* badge style="info" value="Value" */>}}` | {{< badge style="info" value="Value" >}} |
| `{{</* badge title="Default" */>}}` | {{< badge value="Default" >}} |
## Use in links
A badge can be wrapped in markdown link producing following result: [{{< badge title="Hugo" value="0.147.6" >}}](https://github.com/gohugoio/hugo/releases/tag/v0.147.6)
```tpl
[{{</* badge title="Hugo" value="0.147.6" */>}}](https://github.com/gohugoio/hugo/releases/tag/v0.147.6)
```
@@ -1,10 +1,9 @@
# Hints
Hint shortcode can be used as hint/alerts/notification block.
There are 3 colors to choose: `info`, `warning` and `danger`.
Hint shortcode can be used as a hint/alert/notification block.
```tpl
{{%/* hint [info|warning|danger] */%}}
{{%/* hint [info|success|warning|danger] */%}}
**Markdown content**
Lorem markdownum insigne. Olympo signis Delphis! Retexi Nereius nova develat
stringit, frustra Saturnius uteroque inter! Oculis non ritibus Telethusa
@@ -13,12 +12,24 @@ stringit, frustra Saturnius uteroque inter! Oculis non ritibus Telethusa
## Example
{{% hint %}}
**Markdown content**
Lorem markdownum insigne. Olympo signis Delphis! Retexi Nereius nova develat
stringit, frustra Saturnius uteroque inter! Oculis non ritibus Telethusa
{{% /hint %}}
{{% hint info %}}
**Markdown content**
Lorem markdownum insigne. Olympo signis Delphis! Retexi Nereius nova develat
stringit, frustra Saturnius uteroque inter! Oculis non ritibus Telethusa
{{% /hint %}}
{{% hint success %}}
**Markdown content**
Lorem markdownum insigne. Olympo signis Delphis! Retexi Nereius nova develat
stringit, frustra Saturnius uteroque inter! Oculis non ritibus Telethusa
{{% /hint %}}
{{% hint warning %}}
**Markdown content**
Lorem markdownum insigne. Olympo signis Delphis! Retexi Nereius nova develat