Xin 79bb4504a0
feat: add support for icon in badge shortcode (#525)
* feat: add icon support to badge shortcodes

- Introduced an optional icon parameter to both badge.html files.
- Updated the badge rendering to include the icon alongside the content.
- Enhanced the layout for better alignment of icon and text.

* feat: add new feature shortcode

* docs: update badge doc
2024-12-28 13:50:22 +00:00

1.4 KiB
Raw Blame History

title linkTitle sidebar
Other Shortcodes Others
exclude
true

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

Badge

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

Result:

{{< badge "Badge" >}}

Variants:

{{</* badge content="info" type="info" */>}}
{{</* badge content="warning" type="warning" */>}}
{{</* badge content="error" type="error" */>}}

Result:

{{< badge content="info" type="info" >}}   {{< badge content="warning" type="warning" >}}   {{< badge content="error" type="error" >}}

With link and icon:

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

Result:

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

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" >}}