記事内でコードを成型して表示させるエリアを作りたい「Crayon Syntax Highlighter」

2017年10月29日2018年11月7日ブログ運営, ライフハック

Contents

Crayon Syntax Highlighterを使えば、成型エリアが作れる

ブログなどのWordPress記事でPHPやHTMLなど各言語のソースコードを、見やすく成型表示したいときは「Crayon Syntax Highlighter」というプラグインを使う事をオススメします。

Excelやプログラムのソースコードを調べるときによく見かけると思います。

例えば、「Crayon Syntax Highlighter」を使ってサンプルコードを書くと、下記のような感じにできます。

行の見分けやタグにも色がついて、かなり見やすくなります。

// A sample class
class Human {
	private int age = 0;
	public void birthday() {
		age++;
		print('Happy Birthday!');
	}
}

// A sample class

class Human {

private int age = 0;

public void birthday() {

age++;

print('Happy Birthday!');

}

編集画面のエディタ項目に「＜＞」みたいなマークがあるので、そこを選択すると下記コードエリアの追加画面がでてきます。

すべて英語ですが、細かく設定できます。「Language」の項目で、「PHP」などの言語を指定できます。

設定が終わったら上部の黒いバーの右側にある「Add」を押すと完了です。