シンタックスハイライトに「Prism.js」を導入したけど「Gist」も捨てがたい

BLOG型のクッキー

 ブログにソースコードを載せる際に使う「シンタックスハイライト」を探していたんですが、このブログでは『Prism.js』を使ってみることにしました。

『Prism.js』導入

CSSとJavaScriptのファイルをダウンロード

『Prism』のサイトから、CSSとJavaScriptのファイルをダウンロードして自分のサイトにアップロードし、PHPに追記するだけです。「Language」でシンタックスハイライトしたい言語を選びます。

リンクPrism

表示例

 私は「Coy」というテーマを選びました。デフォルトではこのように表示されます。

<?php if(in_category('wordpress')) : ?>
    <link rel="stylesheet" type="text/css" href="prism.css" />
    <script type="text/javascript" src="prism.js"></script>
<?php endif; ?>

 このようにして、カテゴリーが「wordpress」の時のみCSSを読み込み、スクリプトを実行するようにしました。

『Gist』でもいいような気がしてきた

 ここまで書いておいて何ですが、私のブログは技術系ではないですし、ソースコードを紹介することもあまりないと思うので、「GitHub」の『Gist』でもいいような気がしてきました。

リンクCreate a new Gist · GitHub

 ちなみに、同じものを『Gist』を使って表示させるとこんな感じになります。

 どっちを使おう……。

スポンサーリンク

シェアする

フォローする