drowl87/hextra_mirror
1
0
Fork 1
mirror of https://github.com/imfing/hextra.git synced 2025-08-24 07:06:48 -04:00
Code Issues Actions Packages Projects Releases Wiki Activity
Files
22c1a4f9dfaca34837661cdcdb0f8612c9a28ee5
hextra_mirror/exampleSite/content/docs/guide/shortcodes/others.md
Ludovic Fernandez 22c1a4f9df feat(badges): colors and border (#774) 
* feat(badges): add more colors and allow to disable the border

* feat(badges): more colors

* chore: generate

* docs: add Others inside the sidebar

* chore: i18n

---------

Co-authored-by: Xin <5097752+imfing@users.noreply.github.com>
2025-08-23 14:42:23 +01:00

4.5 KiB
Raw Blame History

title, linkTitle, next
title linkTitle next
Other Shortcodes Others /docs/guide/deploy-site

{{< callout type="warning" >}} Some of these are Hugo built-in shortcodes. These shortcodes are considered less stable and may be changed anytime. {{< /callout >}}

Badge

Examples

{{< badge "default" >}}  {{< badge content="border" border=false >}}  {{< badge content="color" color="green" >}}  {{< badge content="link" link="https://github.com/imfing/hextra/releases" >}}  {{< badge content="icon" icon="sparkles" >}} 

Usage

Default

{{< badge "Badge" >}} 

{{</* badge "Badge" */>}}

Colors

{{< badge content="Badge" >}}  {{< badge content="Badge" color="purple" >}}  {{< badge content="Badge" color="indigo" >}}  {{< badge content="Badge" color="blue" >}}   {{< badge content="Badge" color="green" >}}   {{< badge content="Badge" color="yellow" >}}   {{< badge content="Badge" color="amber" >}}   {{< badge content="Badge" color="orange" >}}   {{< badge content="Badge" color="red" >}} 

{{</* badge content="Badge" */>}}
{{</* badge content="Badge" color="purple" */>}}
{{</* badge content="Badge" color="indigo" */>}}
{{</* badge content="Badge" color="blue" */>}}
{{</* badge content="Badge" color="green" */>}}
{{</* badge content="Badge" color="yellow" */>}}
{{</* badge content="Badge" color="amber" */>}}
{{</* badge content="Badge" color="orange" */>}}
{{</* badge content="Badge" color="red" */>}}

{{< badge content="Badge" border=false >}}   {{< badge content="Badge" color="purple" border=false >}}   {{< badge content="Badge" color="indigo" border=false >}}   {{< badge content="Badge" color="blue" border=false >}}   {{< badge content="Badge" color="green" border=false >}}   {{< badge content="Badge" color="yellow" border=false >}}   {{< badge content="Badge" color="amber" border=false >}}   {{< badge content="Badge" color="orange" border=false >}}  {{< badge content="Badge" color="red" border=false >}} 

{{</* badge content="Badge" border=false */>}}
{{</* badge content="Badge" color="purple" border=false */>}}
{{</* badge content="Badge" color="indigo" border=false */>}}
{{</* badge content="Badge" color="blue" border=false */>}}
{{</* badge content="Badge" color="green" border=false */>}}
{{</* badge content="Badge" color="yellow" border=false */>}}
{{</* badge content="Badge" color="amber" border=false */>}}
{{</* badge content="Badge" color="orange" border=false */>}}
{{</* badge content="Badge" color="red" border=false */>}}

Variants

{{< badge content="Badge" icon="sparkles" >}}  {{< badge content="Releases" link="https://github.com/imfing/hextra/releases" icon="github" >}} 

{{</* badge content="Badge" icon="sparkles" */>}}
{{</* badge content="Releases" link="https://github.com/imfing/hextra/releases" icon="github" */>}}

Options

Name Description
content The text of the badge.
link The link of the badge.
icon The icon of the badge.
color The color of the badge.
gray (default), purple, indigo, blue, green, yellow, amber, orange, red.
class The class of the badge.
border Adds or removes the border (default: true).

YouTube

Embed a YouTube video.

{{</* youtube VIDEO_ID */>}}

Result:

{{< youtube id=dQw4w9WgXcQ loading=lazy >}}

For more information, see Hugo's YouTube Shortcode.

PDF

With PDF shortcode, you can embed a PDF file in your content.

{{</* pdf "https://example.com/sample.pdf" */>}}

You can also place the PDF file in your project directory and use the relative path.

{{</* pdf "path/to/file.pdf" */>}}

Example:

{{< pdf "https://upload.wikimedia.org/wikipedia/commons/1/13/Example.pdf" >}}