Github Shortcode Repository

So, I’ve made a repository to store potentially useful shortcodes that aren’t built into Hugo. Currently there is only one shortcode that I wrote (an audio shortcode) in the repo, but anyone is welcome to contribute. I don’t know if there is already a repo dedicated to something like this, but here’s mine.


I would recommend that you put the shortcodes below layouts/shortcodes. Then people can just include your repo as a Theme Component.


@bep Done. Thanks for the suggestion.

I have created something similar with the shortcodes. This project called as Use shortcodes. Hope this project also will be useful for people.
Here is the repository and corresponding topic:


Those expands are nice. Are those using the details and summary elements? I’m on my phone and don’t see the sources output.

Also, for the OP, I just ran across this which includes some shortcode snippets and some related discussion from the tail of 2017:

Not a whole lot there but cross-linking for reference.


Not sure, that I understood correctly. Could you please describe what do you mean about details and summary elements for the expand shortcode?

Probably means this :slight_smile:



Thank you for pointing out!

Unfortunately this expand doesn’t use the details and summary elements.
As I know these elements don’t work in IE10+ and Edge. Instead, my implementation supports these type of browsers also. Not a strong argument, but some people probably could have these requirements.

Also I have tried to implement the expands by using minimum of the js code. The pure-expand shortcode use only css. The main problem that I faced out it’s dealing with the correct animation effects.

Thanks for verifying. I recommend opting for semantic markup (read: W3C/WHATWG recommendations) whenever possible regardless of default UX. Leveraging progressive disclosure using details and summary elements, for example, helps ensure HTML semantics are clean, offers a usable experience to assistive technology for free, usually degrades well in older browsers and, naturally, will see improved support over time.

As corollary, using semantic markup more frequently serves as a catalyst to push vendors forward.

That said, and as mentioned, what you’ve produced is quite nice. And if it can be read by a screen reader all the better until disclosure support improves in off-spec browsers. Great job!

1 Like