カッコよくソースコードを表示するワードプレスプラグインCrayonが文字化けする・・・。

Crayon Syntax Highlighter

プラグイン入れたくない派の僕をもってしても、入れざるを得ないほど、カッコいいソースコードの表示が可能な無料プラグイン。

このサイトでもガンガン使ってます。

プログラミング系のブログ運営してる方で、もし入れていない方は、是非Crayonを試してみてください。

基本的に入れるだけで適用されてソースコード入力をすれば、勝手にビジュアルがカッコよくなるという優れもの。

しかし、問題が・・・。

“<” ← Crayonでコイツが文字化けする

HTMLのコード表示ならガンガン使うことになる”<“がガッツリ文字化けしています。

ちなみに使っているエディターはワードプレス5のブロックエディター。

ここからソースコードを書いていくわけですが、どうにも”<”をそのまま表示できずに困っていました。

一応回避方法としてブロックをクラシック入力にしてソースコードを記述すると文字化けしないことには気づいていたんです。

でもめんどくさいんですよね。せっかく新しいエディター気分よく使ってるのに、一々クラシック選択しないといけないの。

解決策見つけました

Crayon 設定の”コード”→”コード内のHTMLエンティティを出力”

コイツにチェックを入れると、ブロックエディタの方からでも”<“が文字化けすることがなくなりました。

同じ症状で困っている方はぜひ試してみてください。