Hey Hugo community! :waving_hand: I wanted to share a little project I’ve been working on - hugo-admonitions. It’s a Hugo module that helps you create beautiful admonition/callout blocks in your content using simple markdown syntax. Key Features: Multiple predefined types: note, info, warning, e…

A style element outside of the head element won’t pass validation: [image] Use an external stylesheet instead, and add instructions to your module’s README. To write portable Markdown (GitHub, Obsidian, Typora, etc.) use blockquotes instead: https://gohugo.io/render-hooks/blockquotes/#alerts Ve…

Thank you so much for your detailed feedback! :pray: I really appreciate you taking the time to point out these important issues. I will fix these problems as soon as possible, especially moving the styles to an external stylesheet for better compatibility. By the way, I’m curious about the validat…

Search for HTML validator. The W3C’s one should be one of the first hits. They also offer CSS validation, though that’s something your browser’s developer tools does, too.

Another solution, using CSS: Hugo: add custom infoboxes | Roneo.org (Does not support dark mode)

Regarding your recent changes: Use the Store method instead of Scratch The AlertType is already lowercase… no need to convert it again Use render-blockquote-alert.html instead of render-blockquote.html to reduce chance of template overrides Internationalize (use T function and create at …

Think about supporting extended syntax or mention limitations in the README of your project.

Thank you so much for your detailed suggestions! :pray: I really appreciate you taking the time to help improve hugo-admonitions. I’m happy to let you know that I’ve implemented all the changes you recommended: :sparkles: Major improvements include: Switched to using Store method instead of Scrat…

Really appreciate your attention to detail and the suggestion about documenting syntax features.:pray: I’m currently working on implementing support for extended syntax!

The github.com/KKKZOZ/hugo-admonitions module has evolved a bit since the original post. Take it for a spin: git clone --single-branch -b hugo-forum-topic-52576 https://github.com/jmooring/hugo-testing hugo-forum-topic-52576 cd hugo-forum-topic-52576 hugo server Notes: The Markdown syntax is c…

I’ve learned a lot from this project, thanks for your help @jmooring

Hugo-admonitions: A simple way to add beautiful Callouts to hugo site

tips & tricks

KKKZOZ April 24, 2025, 8:30am 13

I’ve updated the code to support dark mode for different themes. Feel free to try it out and give feedback!

2 Likes

Topic		Replies	Views
Admonition for hugo support	3	2079	November 29, 2024
Can you please provide me with feedback on my shortcode for displaying admonitions? support	6	162	September 27, 2024
Is there any way to modify Hugo Admonition Shortcode to Support Obsidian Format support shortcodes	9	255	September 28, 2024
Is it possible to use a goldmark extension or other approach to render admonition blocks without shortcodes? support	4	849	March 22, 2023
Admonitions only through themes? support	2	604	January 24, 2024

Hugo-admonitions: A simple way to add beautiful Callouts to hugo site

Related topics