スポンサーリンク

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

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

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;
著作権マーク
きらり

きらり

文字コードが2つあるの?

結耶

結耶

えっとね。「文字実体参照」(上)「数値文字参照」(下)ってあるらしいよ!詳しくは私もよくわからないけど(^^;

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

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

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

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

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

拡張ボタンの設定

場所[設定[AddQuicktag]]

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

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

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

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

使い方

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

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

<p>これはサンプルです</p>

&lt;p&gt;これはサンプルです&lt;/p&gt;

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

&lt;p&gt;これはサンプルです&lt;/p&gt;

<p>これはサンプルです</p>

結耶

結耶

特殊文字の中には変換されないものがあります。よく使うものはAdd Quicktagにコードを登録してボタンを作ると便利ですよ。

その他のツール

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

応援よろしくお願いします。
      ブログランキング・にほんブログ村へ

お問い合わせはこちら
この記事を書いた人
結耶(ゆうや)

2017年9月からブログを始め、2018年1月にWordPressに変更しました。知識ゼロのから始めた超初心者で、WordPressやHTML、CSSなど勉強したことを書いています。
愛知県在住。多発性硬化症(MS)という難病と闘っています。

登場キャラクター
きらり
きらり

ある日ひょっこり現れ住みついた居候(いそうろう)。今は結耶と一緒にWordPressやアフィリエイトのことを勉強している。
性別は♂ 。どこから来たかは不明。

楽天ROOM