Highlighting Code Block に prism.js の新しい言語を追加

高度な設定でのカラーリングの追加

「基本設定」の下にある「高度な設定」でカラーリングを追加設定できる。

ダウンロードするときは、Homeからではなくこの「Customize your download」ページから実行する方がわかりやすので、必ずここらダウンロードすること。

上の画像のデフォルトでの「使用する言語セット」は、「Customize your download」にて確認すると以下のようになっているはずである。

以下がデフォルトのカラーリングの設定になっている。チェックが入っているところ。

以上のチェックを確認した上で、新しく追加する言語にチェックを入れてprism.jsをダウンロードする。
私の場合は「Arduino」と「Lua」「CSV」「Markup」「Java」言語を追加した。
ファイルそのものは小さい、ダウンロードはすぐに終わる。

Homeの中断のあたりに「Supported languages」という項目があり、ここに Prism でサポートする言語のすべてが記述されている。
language-xxxx (または lang-xxxx) クラスの xxxx の代わりに使用する対応するエイリアスのリストである。

Arduino —arduino, ino この場合、（arduino:”Arduino”）（ ino:”Arduino”,）のどちらかにする。

例えば、上の例を並べて記述した場合：
（arduino,ino:”Arduino”）これはエラーになってHDCのブロックが消えて使えなくなるので注意！
また他が原因でエラーになる場合はどこかで記述の仕方が間違っているか、スペルが間違ってるので確認。

Lua —lua は lua:”Lua”,
CSV —csv は csv:”CSV”,
Markup —xml は xml:”Markup”,
Java —java は java:”Java”,

これを先に入れて保存してもエラーにはならない。カラーリングが表示されないだけ。

言語の追加方法は具体的には以下のような順番で行うことができる。

シンタックスハイライトに対応する言語を増やすには、HCB設定ページ内の「使用する言語セット」を編集する。

サポートする言語のリストを、「クラス名：”表示名”,」という形式で、,区切りで入力。

例：PerlとGoを追加する。

html:"HTML",
css:"CSS",
... その他の言語 ...
perl:"Perl",
go:"Go",

こうすることで、セレクトボックスの言語リストに項目が追加される。

続いて、プラグインで読み込む prism.jsファイル（シンタックスハイライトを実行するスクリプト）をカスタマイズする。

prism.jsのカスタマイズページで、Step1 で定義した言語リストに一致するようにチェックを入れる。ここでは既にデフォルトのチェックが入っているので追加した分をチェックするということになる。
上記のカスタマイズページの下部までスクロールするとJSファイルのダウンロードボタンがあるのでそこをクリック。
ダウンロードしたファイル（ prism.js ）をあなたが有効化しているテーマフォルダ内にアップロード。
以下の画像にそのパスが表示されているのでアップロード先はわかると思う。
ここではystandard-childとなっているのでその中にファイルを入れることになる。
「高度な設定」->「独自prism.js」で「prism.js」を入力し、「変更を保存」をクリックして完了。