Add code to your page with syntax highlighting and a copy button so your users can easily copy the code to their clipboard with the press of a button. The code may be entered inside the shortcode or come from an external file.

<div class="mydiv bg-primary shadow text-white">
	<h1 class="title">Hi there</h1>
	<p class="lead">I'm inside a code shortcode. Check out my syntax highlighting!.</p>


Simply place the following shortcode on the page

Code in the shortcode

{{< code lang="LANG" >}} [your code] {{< /code >}}

Code from a file

{{< code lang="LANG" file="code/mycode.html" >}}



The lang parameter defines the language to be used for code highlighting. You can find a complete list of supported languages here.

Example: lang="html"


The file parameter allows you to define an external file that contains your code to be displayed. This is done by giving a path to that file, starting from the root directory of your site.
For example, a HTML file named ‘mycode.html’ you wish to link that is in the docs/code/ directory can be defined as follows: file="code/mycode.html".

Read more