Code Syntax Highlight
By default, Ghost displays code cards without syntax highlighting. The OnFlow theme offers a solution to automatically add syntax highlighting to all code cards.
Code Injection is required to add custom JS.
The OnFlow theme includes an API to integrate Shiki (opens in a new tab) for syntax highlighting in all code cards. Insert the following code snippet into your site:
<script>
window.pvs && pvs.initCodeHighlight();
</script>
This code snippet adds a code syntax highlighting to all code blocks. If you want to add additional features such as line numbers and language badge, use the following code snippet:
<script>
window.pvs && pvs.initCodeHighlight({
clipboardButton: true,
lineNumbers: true,
languageBadge: true,
});
</script>