HTMLタグはもちろんショートコードや定型文などを登録すれば投稿エディター上にボタン(クイックタグ)ができ、登録したコードなどを簡単にエディターに挿入できる便利なプラグイン。AddQuicktagなしでは記事が書けないという人も多いのでは。そんな投稿編集に便利なプラグインAddQuicktagにHTMLエンティティ(htmlエスケープ変換)する拡張コードボタンがあることに今更気づいて使ってみたら簡単で便利だったのでAddQuicktagのHTML特殊文字変換の使い方についての備忘録。簡単すぎて備忘録にするまでもないんですけどね。style="color:red;">「これは強調です。ストロングでぶっといヤツ」</strong>とそのまま投稿エディターに入力すると当然下のようにブラウザに表示される。style="color:red;"></strong>と入力するとhtmlタグとして表示の仕方をブラウザに伝え、受け取ったブラウザは「はいはい、太い文字で赤い文字で表示すればいいのね」とモニターに表示するということ。「htmlタグとしてじゃやなくてそのまま表示してほしいんだよなあ~」とブラウザに伝える場合に、HTMLエンティティ・HTMLエスケープ・HTML特殊文字変換の処理が必要になってくる。HTMLエンティティとは通り名みたいで正式には「文字参照」というらしいが、むずかしい話はわからないのでHTMLエンティティでいくとする。軽量・簡単なJavaScriptシンタックスハイライターの使い方」でソースコードをPrismを使ってハイライトする際にHTMLエンティティ変換する必要があったので最初はウェブ上のHTMLエスケープツール、HTML特殊文字変換ツールでせっせと変換してたのだが何だか面倒になってきていろいろ探しているうちに、AddQuicktagにHTMLエンティティする拡張コードボタンがあるのを見つけた。長い間お世話になっているAddQuicktagなのに今更HTMLエンティティを見つけるとは情けない話だ。AddQuicktagのHTMLエンティティ拡張コードボタンの使い方AddQuicktagのHTMLエンティティの使い方と言っても本当に簡単。AddQuicktagの設定にいくAddQuicktagの設定htmlentitiesボタンにチェックを入れるhtmlentitiesボタンにチェックを入れるAddQuicktagの設定の下のほうの「拡張コードクイックタグボタン」に「htmlentities」というボタンがあるのでチェックを入れて変更を保存。HTML」ボタンが現れる。実際にHTMLエンティティするのも簡単。HTML)こともできる。Entities」をクリックする。HTMLエンティティ変換あとこの様にHTMLエンティティされて、ブラウザにそのまま表示されるように特殊文字が変換されている。ちなみに上のHTMLソースは<head>部分のコードなので普通はブラウザに表示されることはない。実際にHTMLエンティティして表示してるのが下の部分。HTML」をクリックする。HTML)あとこのように元のHTMLソースの状態に戻る。<head>部分のコードなので表示されることはない。PrismでHTMLコードをハイライトしてみる上のHTMLエンティティ変換されたHTMLソースをPrismでハイライト表示してみる。...https://f-af.com/prism-syntax-highlighter/やっぱりAddQuicktagて便利なWordPressプラグイン、ますます手放せなくなります。今のところはHTMLエンティティ拡張コードボタンを使っても重くなったりとか、不具合が出たということはない。あれこれ堂的備忘録ページトップ。