レンタルサーバー速度比較記事はこちら

記事中にショートコードを紹介する方法

こちらの記事を書くのに非常に手間取りました。
記事の中でショートコードを紹介したい場合、どうすればいいのか。
ショートコードをそのまま記述すると実行されてしまい、文章として表示できません。

ただ単に、
[red_hello] と書きたいだけなのに、ショートコードが実行されてしまい

こんにちは

と表示されてしまいます。

ちなみに[red_hello]はショートコードのテストで作成したもので、
<p style="color:red;">こんにちは</p>
を出力するだけのコードです。

[ ] を二重にする

WordPress公式でショートコードをエスケープする方法として紹介されていました。

[[red_hello]]

このように括弧を二重にすることでショートコードを動作させず、そのまま文字として表示できます。

開始タグと終了タグを持つショートコードの場合は、一番最初と最後の括弧だけを二重にします。

[[color_string]あいうえお[/color_string]] 参考 ショートコードCodex

<pre><code></code><pre>で囲ってみる

こんにちは

実行されてしまいました。<pre><code>で囲うだけでは実行を止められないようです。

SANGOのソースコードボックスの中に書いてみる

このサイトで使用しているテーマ「SANGO」にはソースコードボックスがあるので、そちらを利用してみます。

コード
[red_hello]

こちらは抑制が出来ましたね。
しかしボックスの装飾がされるので、記事中でどう紹介したいのか、ケースバイケースでしょうか。

[ ]を&#91 &#93 にしてみる

テキストビューで、
&#91red_hello&#93
と書いたら行けるのでは?とやってみました。
プレビューでは上手くいきましたが…、ビジュアルビューに切り替えると&#91をご丁寧に [ に変換してくれたあげく、red_helloの文字も削られて [_hello] という表示になってしまいました。
もちろん再度テキストビューに切り替えると、[_hello] となっています。

ということで、この方法は断念。

結論

公式で紹介されている通り、二重括弧でエスケープするのが安定ですね。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です