Blogger で highlight.js を使用する

highlight.js を使用してソースコードのシンタックスハイライトを行えるようにします。

公式サイトは以下になります。

• https://highlightjs.org/

Blogger のメニュー画面から「テーマ」>「HTML の編集」を選択し、</head> の直前に以下のコードを追加します。

<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/default.min.css" />
<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/highlight.min.js"></script>
<script>hljs.initHighlightingOnLoad();</script>

default の箇所を変更することでテーマを変更できます。
当ブログでは monokai-sublime を使用しています。

指定できるテーマは以下で分かります。

• https://github.com/isagalaev/highlight.js/tree/master/src/styles

各テーマのサンプルは以下で見れます。

• https://highlightjs.org/static/demo/

また、9.12.0 という箇所はバージョンを表しており、公式サイトで現在の最新バージョンを調べて変更したほうがよいと思います。