【WordPress】記事にHTMLやPHPのソースコードを表示

WordPressを使っていて、記事にHTMLやPHPのソースコードを載せたいとき、コードをそのまま記事に貼り付けてもうまく表示されない場合があります。
そんなときに、確認しておきたい注意点をまとめました。

１．ビジュアルエディタで記事を書く

WordPressの記事を書いている画面で、右上に「ビジュアル、テキスト」というタブがあります。
ソースコードを出したいときは、予め「ビジュアル」タブの方を選択し、ソースコードを貼り付けます。
「テキスト」を選択した状態でソースコードを貼り付けると、コードがタグとして認識されてしまい、記事上に表示されません。

２．「<、>」を「&lt;、&gt;」に置き換える

上記で説明したテキストエディタ（「テキスト」タブ）を使って記事を書く場合は、「<」と「>」は特殊文字のため、タグとして認識されてしまいます。
その場合は、「<」は「&lt;」、「>」は「&gt;」と書くと、タグではなく文字列として記事上に表示することが出来ます。

３．プラグインを使う

WordPressでは「Crayon Syntax Highlighter」というプラグインを使って、記事上にソースコードを貼り付けることが可能です。
プラグインのインストールは必要ですが、言語を指定することでコードをシンタックスハイライトしてくれるので、長めのソースコードを出すときには見やすくなって便利です。
「Crayon Syntax Highlighter」の使い方は、以下の記事をご覧下さい。

【WordPress】記事内にソースコードを<pre>タグで表示

まとめ：HTMLやPHPのソースを記事に載せるときは注意が必要

HTMLやPHPのソースコードを載せるときの注意点をまとめました。
コードが思ったように表示されないときは、これらの部分を見直してみてください。
また、載せる方法は色々あると思いますので、状況に応じて使いやすいものを利用してください。