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>

 

garicchi
対話システムとSFとアニメが好き たまにMicrosoftコミュニティに出現します たまに日経Linuxとラズパイマガジンで記事を書いたり Microsoft MVP 2014~2018(引退済み)

コメントする

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

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