Highlight ghost with highlight.js

frontend

Similar to Prism, as another popular code highlight component, highlight.js can also be added to ghost in the same way.

  1. Add the theme css to Site Header part. You can choose your preferred style by selecting at the theme list. I like monokai :)

    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.6.0/styles/monokai.min.css" />

  2. Add the js file and start code to Site Footer part.

    <script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.6.0/highlight.min.js"></script>
<script>
hljs.highlightAll();
</script>

  3. Add highlightjs copy code plugin if you want to copy the code block by one click.

Support me