GitHubPagesにHighlight.jsでシンタックスハイライトする

GitHubPagesにJekyllでmarkdownを使ってサイトを作ってるとシンタックスハイライトがちょっとめんどくさくなります。

まず_config.ymlに書く、markdownのところはredcarpetにしましょう

markdown: redcarpet

redcarpetなら“`とmarkdownで書いたソースコードが<pre><code>に変換されるのでhighlightjsと相性がよいです。

redcarpet以外だとcodeにかわっちゃう場合があって、そうなるとbootstrapと干渉していろいろめんどくさいのでredcarpetがよさそう。

あとは通常どおりhighlightjsを使えばOK

<link rel="stylesheet" href="/css/styles/github.css">
<script src="/js/highlight.pack.js"></script>

<script>
hljs.initHighlightingOnLoad();
</script>

 

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください