【WordPress】特殊文字を変換して表示させるには？

2019年12月29日2019年12月30日便利なプラグイン

WordPressのアップデート後に使えなくなったプラグイン『Crayon Syntax Highlighter』ですが、代替として『Prism.js』を導入しました。

Crayon Syntax Highlighterを使っていた時はCrayon Syntax Highlighterにエディタ機能がついていて特殊文字は入力すればプラグインが変換してくれていました。
ですが今回導入した「Prism.js」にはエディタはありません。

なのでこれからはコードをテキストとして表示させる時は自分で特殊記号をコードで記述しなくてはならなくなりました。

と思い探してみたらいい方法を見つけました！使っているプラグインの中に変換してくれるものがあったんです。なので今回はその方法を紹介したいと思います。

特殊文字(記号)とは

HTMLに直接書いても表示されない文字があります。それらの文字をWebページで表示させるには専用の文字コードが必要です。
文字コードは特殊文字をブラウザで表示させるためのコードです。

よく使う記号

私がよく使う(よく見る)特殊記号です。

	 	改行しない空白(スペース)
<	&lt; &#60;	小なり
>	&gt; &#62;	大なり
&	&amp; &#38;	アンバーサンド
"	&quot; &#34;	クォーテーション
'	&apos; &#39;	アポストロフィ
[	&lbrack; &#91;	左ブラケット
]	&rbrack; &#93;	右ブラケット
©	&copy; &#169;	著作権マーク

「文字実体参照」(上)が一般的によく使われています。

プラグイン「Add Quicktag」でコードに変換

以前紹介したプラグイン「Add Quicktag」に特殊文字をコードに変換できる機能があります。

この「Add Quicktag」はよく使うタグなどを登録してテキストエディタでボタンを追加でき効率よく記事が書ける便利なプラグインです。このAdd Quicktagの拡張オプションを使うと特殊文字を文字コードに変換できます。

※Add Quicktagプラグインの使い方などは上記リンク先のページで紹介していますので参考にしてください。

拡張ボタンの設定

設定画面を開くと追加するボタンの登録画面が表示されます。その画面の一番下までスクロールします。

「拡張コードクイックタグボタン」という項目があります。

htmlentitiesの横のチェックボックスの使いたい箇所に チェックを入れてください。

チェックを入れたら変更を保存をクリックしてください。

使い方

投稿画面のボタンにHTML EntitiesとDecode HTMLというボタンが追加されていると思います。

変換したいコード(または特殊文字)を選択範囲指定してHTML Entitiesをクリックすると変換されます。

Decode HTMLをクリックすると元に戻ります。

その他のツール

WordPress以外の方やプラグインを使いたくない方は特殊文字を変換してくれるツールがあるのでそちらを利用してください。