Shortcode: codecaption

Nov 15, 2020
shortcode code codecaption

Source

Searched for hugo shortcodes and found this Github repo. Copied the HTML without the comments into layouts/shortcodes/codecaption.html and then just wrap the code to be displayed in a code box as per the example.

There are other shortcodes to copy over.

add the double curly brackets

< codecaption lang="html" title="Code caption shortcode" >
    code to be displayed in the box
< /codecaption >

Purpose

Adds title to code blocks.

Example of how to use this shortcode

Code caption shortcode

1
2
3
4
5
6
7
8


<figure class="code">
  <figcaption>
    <span>{{ .Get "title" }}</span>
  </figcaption>
  <div class="codewrapper">
    {{ highlight .Inner (.Get "lang") "linenos=true" }}
  </div>
</figure>

Image of shortcode result

example

Shortcode: codecaption

Source

Purpose

Example of how to use this shortcode

Image of shortcode result

See Also

Breadcrumb