Bloggerで、highlight.jsを使う

一応エンジニアブログなので、まずはソースを綺麗に表示したい。

highlight.jsが軽くて良さそうなので、使ってみた。

■設定

・Bloggerにログインしてメニューから「テーマ」を選択

・テーマの横の「︙」をクリックして、「HTMLを編集」を選択

・ヘッダーの最後に下のコードを入れて保存（</head>の直前でOK）

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

■使い方

<pre><code class="XXXX">
  ソースコード
</code></pre>

"XXXX"の部分は表示させる言語を指定する。 例えば、C#なら"cs"とか。

ここを参考にする。 

https://github.com/highlightjs/highlight.js/blob/master/SUPPORTED_LANGUAGES.md

テスト投稿

試しに投稿してみる。

highlight.jsのTEST

{
	NSLog(@"hoge");
}