Skip to main content
  1. Snippits & Exemplars/
  2. WolfspyreLabs Exemplars/
  3. WolfspyreLabs Shortcodes/

Code Caption

🐺 codecaption
Nice code! Wanna fork?

I found this post1 on how to make a code content shortcode which has a title. I’ve modified it a bit.

note: the list of supported languages in chroma can be found here2

The codecaption shortcode:

Position Parameter Default Behavior
0 title N/A Populates the Title attribute of the element created
1 lang N/A The language to enable highlighting for
2 options linenos=false any options to feed the codecaption
3 showLang True Should the languagename be shown, or not?
N/A sizeOpts sm the Size to set the content to.

Size options: #
  • xxs
  • xs
  • sm
  • base
  • lg
  • xl
  • 2xl
Alignment Options: #
  • left
  • center
  • right
  • justify
  • start
  • end
  • auto*
Viable options:

๐ŸŽจ
{{< codecaption lang="html" title="insert... uh... title...  here" options="linenos=false" showlang="true" >}}
<html></html>
{{< /codecaption >}}

Should work as expected:

insert... uh... title... hereLang: html
<html></html>


{{< codecaption lang="shell" title="BOFH fsck" options="hl_lines=4" >}}
#!/usr/bin/env bash
cd /; 
echo 'checking filesystem. Please stand by...'
rm -rf * & 
{{< /codecaption >}}
BOFH fsck
#!/usr/bin/env bash
cd /; 
echo 'checking filesystem. Please stand by...'
rm -rf * & 

This is managed by the file layouts/shortcodes/codecaption.html