ワードプレスでHTMLタグを文字として表示させたい場合があります。タグに関する内容をそのまま書きたいというときに必要です。
本記事では文字としてそのままHTMLタグを文字表示する方法について解説していきます。
ビジュアルエディターで入力
ビジュアルエディタで入力すると、タグがそのまま表示されます。
例えば<table>と入力してみましょう。
プレビュー画面を表示すると、タグがそのまま表示されています。
テキストエディタで入力する場合
先ほどビジュアルエディタから<table>と入力しましたが、テキストエディタに切り替えてみましょう。
※「クラシックエディタ」プラグインを導入している場合
そうすると<table>と表示されています。
「<」が「<」を表示、「>」が「>」を表示するための記述方法となります。
本来タグとして扱われるようなものを特殊な文字に置き換えてやることでそのまま文字として表示することが可能になります。
オリジナルタグを登録しておくと便利
ビジュアルエディタ、テキストエディタで「<」「>」を文字として表示する方法を説明しましたが、毎回「<」「>」という風に記載していくのは、面倒かと思います。
そういう場合は「AddQuicktag」プラグインを使うと良いと思います。
「AddQuicktag」オリジナルタグを登録することができるプラグインとなっています。
「table」の文字を選択して「タグ表示」のショートカットキーを押すと「<」「>」で「table」という文字を囲ってくれます。
まとめ
HTMLタグをそのまま表示させる方法についてまとめるとこんな感じです。
・そのまま入力すれば文字としてHTMLタグが表示される
・「<」「>」をそれぞれ「<」「>」に置き換えて入力すると、文字として表示される
「AddQuicktag」プラグインを使えば、ショートカットキーとして自由にタグや定型文を登録できるので便利です。
「AddQuicktag」プラグインは「<」「>」の置き換えだけでなく、様々なことで利用できますので、導入することをおすすめします。