読者です 読者をやめる 読者になる 読者になる

SUB.V8OS.NET

V8OS.NET のサブブログ

はてなブログにHightlight.jsを適用させた

はてなブログのはコードハイライトが導入されていないので、htightlight.jsを使って、 コードハイライトを導入しました。

はてなブログの「ダッシュボード」「メニュー => デザイン」「タブ => 設定」「ヘッダー」の中に、 以下のコードをぶっこんだ

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.9.0/styles/default.min.css">
<link rel="stylesheet" href="https://cdn.rawgit.com/isagalaev/highlight.js/master/src/styles/railscasts.css">
<style>
pre.code{background: #232323;}
pre {
    margin-bottom: 20px;
    border: none;
    border-radius: 5px;
    padding: 0;
}
</style>
<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.9.0/highlight.min.js"></script>
<script>hljs.initHighlightingOnLoad();</script>
<script>
$(document).ready(function() {
    $('pre').each(function(i, block) {
        hljs.highlightBlock(block);
    });
});
</script>

cdnサーバーを持ちたくなかったので、rawgithub.comを使う

rawgithub.comを使って、hightlight.jsのテーマをgithubのコードを使っています。

参考記事はこちら

参考サイト