Docs
Format
Code Syntax Highlight

Code Syntax Highlight

By default, Ghost displays code cards without syntax highlighting. The Format theme offers a solution to automatically add syntax highlighting to all code cards.

Code Injection is required to add custom JS.

The Format 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>