第1回からのサンプルコードを引き継いでいます。こちらからご覧あれ。 最近少しずつhighlight.jsを学んでおり、せっかく学んだからには、本サイトのコードブロックもhighlight.jsにて独自実装するように切り替えようかなと思い始めた今日この頃です。おそらくプラグインで動作させているよりも、高速化には一役買って […]
第1回から第3回までの調査（調査だったんかい！というのは、さておき）で、かなり実用にまわしても問題ないレベルになった。最後にお気に入りのスタイルでも探して締めくくろうと思う。 というのもhighlight.jsのウリのひとつは、97種類もスタイルがあること！一覧は公式で試せるので、まずは見てみよう。 97種類のスタイル […]
第1回では、highlight.jsを使ってみるところをやった。非常に簡単にソースコードのハイライト表示が扱えて初心者にも優しい。そんな今回は、行数を表示してみる。 表示方法はいくつかあるようだが、CSSを使って行数カウントをしてみる。（表示のために一部JavaScriptも使用する） 行数を表示するためのHTMLタグ […]
前回の記事で、いくつかのハイライト表示ライブラリを比較してみた。その中でも、様々な言語への対応や多様なスタイルが用意されていることが魅力的だったので、「highlight.js」を取り上げて詳しく掘り下げていきたいと思っている。 今回は、原点である使い方の部分についての記載。CDNを使う方法は軽く書いたので、今回はファ […]
ハイライト表示？ このブログはwordpressで構成されているが、ソースコードのハイライト表示に「Highlighting Code Block」プラグインを使用している。コレだ。本ブログで採用しているプラグインは、選択できる言語はそんなに多くないが、見た目も綺麗だし行数も表示されるし、なかなか気に入っている。 ソー […]
