CV and personal site of Andy Hunt
Posted: Sunday 21 February 2021 @ 16:16:51
Statamic 3 uses the league/CommonMark
Markdown parser, which outputs fenced code blocks as a code
element inside a pre
element. If that fenced code block specifies the language in the info string, it will output the language as a class name on the code
element. For example the following markdown
```php
<?php echo "foo";
```
will result in the following HTML
<pre>
<code class="language-php"><?php echo "foo";</code>
</pre>
highlight.js is able to search for code blocks when initialized, and highlight based on a class name
This will find and highlight code inside of <pre><code> tags; it tries to detect the language automatically. If automatic detection doesn’t work for you, you can specify the language in the class attribute
The class names output by the markdown parser are the same as the ones used by highlight.js