ワードプレスブログでタグやコードを簡単に見やすく表示する方法は？

ワードプレス関連のブログを書いていると、記事の中でHTMLタグやCSSコードなどをチョコッと入れたいこととかってありますよね。

そんな時、簡単でキレイに見やすく表示する方法はないものか・・・とフトしたきっかけで探してみたいきさつを以下赤裸々（！？）に。

自ブログ記事内のコードを見てガク然・・・

ひとつ前の記事で「重くなったChromeを改善する方法を見つけたよ♪」と書いたんですが、肝心の「呪文」の部分を改めて見てみると、表記が超まぎらわしい・・・

その呪文というのがコチラ↓
–renderer-process-limit=5

実際のとこ最初のハイフン（-）は１つじゃなくて２つ。なのにフォントの関係なのかこうやって見ると２つが団子状にくっついて１つの「横棒」のように表示されちゃってますよね。

ま～些細なことといってしまえばそれまでなんですが、気づいたらメチャメチャ気になりだして、もっと良い方法はないかしらんと初心者なりにグルグル考え始めたのがきっかけです。

そこでフト頭をよぎったのが、よく他のブログで目にするこんな表示↓

これだとコピペもしやすいし、何よりこのフォント（？文字？）だとハイフンとかの記号もハッキリ見やすいですよね。

ってことで上のコレを探すべく、早速検索スタート！でも・・・ここでハタと気づいたんですが、肝心のコレを何と呼ぶのかわからない(^～^;)

仕方ないのでとりあえず「Wordpress ブログ HTMLタグ挿入」とかって苦しまぎれに入れてみると・・・

オオちゃんと見つかりましたー！こんなファジーなキーワードでもわかってくれるグーグル先生、賢すぎ。

でその正体？は「Crayon Syntax Highlighter」というワードプレス用プラグイン。

紹介サイトもたくさんあって、「ソースコード（って呼ぶのね）を記事内にキレイに表示するツール」としては超ポピュラーなようです。

基本的にはデフォルトのままで問題なく使えるけど、その気になればかなり高度な設定もできるらしい。

マア私の場合は今のとこ例の「呪文」を表示するくらいの用途しかないので明らかにオーバースペック（^^;）

でも昔からずーっと気になってたフォーマットだし、ようやく見つけたからにはとにかく一度は使ってミタイ！といてもたってもたまらなくなっちゃった次第。。

ってことで早速この「Crayon Syntax Highlighter」というワードプレス用ブラグインをダウンロード＆有効化。

そしていよいよこのプラグインを使って例の呪文を書いてみたのがコチラ↓

--renderer-process-limit=5

ちなみにさっきまでテキストで入れていた表示がコチラ↓
–renderer-process-limit=5

こうやって見比べてみると、やっぱりプラグインを使った上の表示の方がハイフンが2個入ってるのがハッキリとわかりますよね！

自分みたいなワードプレス初心者でも、こんなプロっぽい？表示が簡単にできて大満足。いや～ワードプレスのプラグイン機能ってマジ「神」だわ～

そんな次第で、自分のワードプレス記事にHTMLタグやCSSコードなどを記載することがあった際には「Crayon Syntax Highlighter」をぜひ！

なおこの「Crayon Syntax Highlighter」プラグインの詳しい設定方法や使い方については、以下のサイトを参考にさせていただきました。

いつもながら先人の知恵に大感謝です！