記事内でコードを成型して表示させるエリアを作りたい「Crayon Syntax Highlighter」
Crayon Syntax Highlighterを使えば、成型エリアが作れる
ブログなどのWordPress記事でPHPやHTMLなど各言語のソースコードを、見やすく成型表示したいときは「Crayon Syntax Highlighter」というプラグインを使う事をオススメします。
Excelやプログラムのソースコードを調べるときによく見かけると思います。
使った時の表示例
例えば、「Crayon Syntax Highlighter」を使ってサンプルコードを書くと、下記のような感じにできます。
行の見分けやタグにも色がついて、かなり見やすくなります。
1 2 3 4 5 6 7 8 |
// A sample class class Human { private int age = 0; public void birthday() { age++; print('Happy Birthday!'); } } |
Crayon Syntax Highlighterの使い方
編集画面のエディタ項目に「<>」みたいなマークがあるので、そこを選択すると下記コードエリアの追加画面がでてきます。
すべて英語ですが、細かく設定できます。「Language」の項目で、「PHP」などの言語を指定できます。
設定が終わったら上部の黒いバーの右側にある「Add」を押すと完了です。