はじめに
WordPress では投稿本文に角かっこ([ ]
)で囲まれた文字列を書くと、ショートコードとして自動的に解釈・実行されます。便利な反面、マニュアル記事や技術ブログで 「こう書くと動きます」 と例示したいときには困りものです。この記事では、ショートコードを “あくまで文字として” 表示したい場面で使える代表的な方法を詳しく解説します。
どうして実行されてしまうの?
WordPress 本体は投稿をパースする際に [shortcode]
パターンを検出し、登録済みなら do_shortcode()
関数で該当処理を呼び出します。言い換えれば、「[
と ]
があるか?」だけで判定しているので、そのまま書けば必ず実行対象になるわけです。
二重ブラケット法
[[shortcode]]
のように 前後を 2 重にすると、WordPress は 「これはエスケープ指示だ」 と判断して 1 重に戻してから表示します。例えば次のように書けば……
<div class="column-wrap column-2">
<div class="column-left">
<h3>新着記事</h3>
[[new_list]]
</div>
<div class="column-right">
<h3>人気記事</h3>
[[popular_list]]
</div>
</div>
読者の画面には [new_list]
と [popular_list]
がそのまま並びます。手軽で見やすいのでまず試したい方法です。
まとめ
- ショートコードを例示するときは “実行させない” 工夫が必須。
- テーマやプラグインの挙動で変わることがあるので、公開前にプレビュー確認は忘れずに。
これらの方法を組み合わせれば、WordPress ブログでも安心してショートコードのサンプルを掲載できます。ぜひご自身の運営スタイルに合わせて使い分けてみてください。