Big-Brained hugo time
I had no idea that hugo shortcodes could call partials. I’m going to try to integrate this more into my themes. Partials can call each other too, which is very handy. Meaning that you can reuse these modular components even more. This is important to me because I want my themes to be usable by someone without any knowledge of hugo internals. There are a lot of great hugo themes out there, but I’ve noticed many of them make heavy use of the data folder and custom parameters. I think this gets in the way of wider adoption because ideally, most things would be configurable from the .md files or the site’s config file.
This is just an opinion, but I would argue that progressive enhancement should apply to how the site is built as well. If somebody just wants to change their site’s basic colors, images, and move some components around, the explanations would ideally be quite simple. That said, I’ve fallen behind on documenting my themes. Partly because I’ve got a bit of an overhaul pending. Of course, anyone who does understand hugo wouldn’t have any issues getting started, but I’m sure they’d have an equal chance of loving or hating my choices.
Using that knowledge, I’ve created a couple of shortcodes that I’m going to port to the base themes.
Recent Audio
I like this one, after I rebuild my html5 audio/video players I may upgrade to these. All things considered, I don’t think there’s anything wrong with the default audio player. This shortcode is very simple, I just include “{{<podcast>}}” into the markdown file.
Big-brained hugo time
Nov 25 2023
Big-brained hugo time
Nov 25 2023
Big-brained hugo time
Nov 25 2023
Big-brained hugo time
Nov 25 2023
Hero
I’m definitely going to steal this for the libre solutions network, allowing for fancier elements to be copied between sites easily. Of course, this shortcode is more customizable.
The parameters are pretty straightforward:
bg: background image, uses the theme’s accent color otherwisetitle: The headingdescription: Any text you want includedhref: The link when the button is clicked
{{<hero
bg="/images/mmbn-banner.webp"img="/favicon.png"btn=“About Me”href="/resume"title=“Gabriel”description=“I’m a passionate and curious Canadian 🇨🇦 with a fascination of Free Software and bottom-up strategies. ✝️ Through Him, all chains are broken - Pray for love and peace always. 🕊️”>}}
You can also reverse the order of items by adding reverse="1"
I’m thinking it’s a handy way to make all kinds of pretty call-outs for things.
Some fields are optional, but I’m working on improving the look and feel of limited ones.