Higlight code on Blogger with highlight.js

While redesigning my blog a little, I've realized that having no code highlighting on a blog aboud code sounds silly. After looking around, I decided to attach this great highlight.js library to my blog engine.

As there is a bunch of articles on how to do that, I'll bet on making mine short. There are 2 steps you need to do to enable code highlighting in your blog:

1. Add highlight.js assets to the bottom of your site's template, e.g. blogger.com > Your Blog > Theme > Edit HTML:

    ...
    <!-- highlight.js -->
    <link href='https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/default.min.css' rel='stylesheet'/>
    <script src='https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/highlight.min.js'></script>
    <script>hljs.initHighlightingOnLoad();</script>
  </body>
</html>

(replace default.min.css with theme you prefer)

2. Wrap your code into pre/code tags:

<pre><code class="javascript">console.log("Hello World!");
</code></pre>

Now you're all highlighted. Enjoy!