1. シンタックスハイライト/highlight.js/ダウンロード

 
1.1 参考サイト
1.2 ダウンロードサイト
1.3 デモ
1.4 ドキュメント

1.1 参考サイト

 参考にさせていただいたのは以下のサイトです。
highlight.jsを言語毎にカスタマイズして使う」

「highlight.jsで行番号を表示させる方法」

「ブログでソースコードをキレイに表示できるJavaScriptライブラリ「highlight.js」の導入方法

1.2 ダウンロードサイト

 ダウンロードサイトは、下記です。

 2017年10月20日 時点では [Get version 9.12.0] のボタンを押して移動します。
 使用する言語を選択して、最下部の [Download] ボタンを押してダウンロードします。

 .zip でダウンロードしてきます。
 highlight.zip の中の highlight.pack.jsstyles ディレクトリ全体を所定のディレクトリに置きます。

 ソースコードを取得する場合は、下記の [Download] ボタンで取得します。


 行番号表示用のプラグインが、下記にあります。


 右のほうにある [Clone or Download] のボタンを押して [Download ZIP] でダウンロードします。
 ダウンロードした highlightjs-line-numbers.js-master.zip の中の src/highlightjs-line-numbers.js を本体の highlight.pack.js と同じディレクトリに置きます。

1.3 デモ

 デモやテーマのサンプルが、下記に紹介されています。
highlight.js demo

1.4 ドキュメント

 言語とクラス名の対応が、下記に記述されています。
CSS classes reference