WordPressでソースコードを表示させるプラグイン『Crayon Syntax Highlighter』をMarsEditから利用する方法

Blogのエントリを書く上でソースコードやコンソールの内容をわかりやすく表示するときに重宝するのがCrayon Syntax HighlighterというWordPressのプラグイン。

このプラグインを導入してMarsEditから利用する場合は、表示したいコードを[html][/html]の間に書けば良いのかとずっと思っていた。

MarsEdit - the blog editor for WordPress, Tumblr, Blogger and more.

ところが、[html][/html]でくくってもちゃんと表示されなかったのだ。

MarsEditから上手く使えない

今まではこんな感じになってる。

[html]
// A sample class
class Human {
private int age = 0;
public void birthday() {
age++;
print(‘Happy Birthday!’);
}
}
[/html]

ちょっと見づらい。

Crayon Syntax HighlighterがMarsEditで上手く表示出来ない原因を調べているときにヒットしたのが上記のサイトで、<pre></pre>タグでかこう必要がある。

<pre></pre>タグを使用してみた。

<pre></pre>タグを使って上記のコードを表示させてみる。

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

Crayon Syntax Highlighterの設定画面を見ると、『Crayonsとして<pre>タグをキャプチャ』にチェックが入っているからなのかな?

Csh wp 01

コードを含めたエントリを書くときにMarsEditからアップ後にWordPressの管理画面で修正することがほとんどだった。なので、その手間が省けるのはやっぱり良いな。もちろん、エントリで表示するコードの種類とか表示方法について細かく設定する場合はWordPressの管理画面で弄る必要はありそうだけど。

この辺は<pre>タグに追加できるみたいなので確認するつもり。

スポンサーリンク
広告

スポンサーリンク
広告

コメントをどうぞ

メールアドレスが公開されることはありません。 が付いている欄は必須項目です