「文字実体参照」を使い、記事の中にショートコードをテキスト表示する方法

公開日:2016年1月6日 使い方など
Knowledge Base パソコン

WordPressでプラグインの紹介などをするときに、ショートコードをそのまま表示して紹介する機会があると思いますが、2重に[]を付けてもちゃんとエスケープされずにショートコードが動いてしまうときの対処方法です。

よく紹介されている2重括弧のエスケープ方法はプラグインのコードの記述やテーマの記述、ワードプレスそのもののエラー回避などの要素によって、環境やバージョンによってはエスケープされない(ちゃんとショートコードが機能してしまう)ことがあります。これを確実にエスケープしてショートコードを表示通りにする方法をテストを含めて紹介します。

実際にテストしてみた結果

環境
Wordpressのバージョン:4.4
テーマ:Simplicity

テストしたプラグイン:ユーチューブのプレイリストを表示する「Youtube Playlist Thumbs」プラグイン

通常通りショートコードを記述すると
[ypt playlist_id=PLTm0aIjoYz7czwMgySSqZ3Qm_BE2Ew_CT] とショートコードが動作しています(当然ですが)

そして、よく紹介されている[]を2重に設置した場合、[[ショートコード]]
[[ypt playlist_id=PLTm0aIjoYz7czwMgySSqZ3Qm_BE2Ew_CT]] とすると通常はエスケープされてショートコードがプログラム変換されて動作するのを防ぐため、ショートコードそのものが表示されるのですが、環境によってはショートコードが動作してしまうことがあります。
※記事作成段階では使用しているプラグインを例に挙げて動作確認を紹介していますが、閲覧される際にはプラグインを使っていないためうまく表現ができていない場合がありますがご容赦ください

もう一つテストしたプラグイン:テーブルを表示する「Tablepress」プラグイン

通常通りショートコードを記述すると
[table “3” not found /]
とショートコードが動作しています(当然ですが)

そして、よく紹介されている[]を2重に設置した場合、[[ショートコード]]
[table id=3 /] とすると通常はエスケープされてショートコードがプログラム変換されて動作するのを防ぐため、ショートコードそのものが表示されるのですが、環境によってはショートコードが動作してしまうことがあります。
※記事作成段階では使用しているプラグインを例に挙げて動作確認を紹介していますが、閲覧される際にはプラグインを使っていないためうまく表現ができていない場合がありますがご容赦ください

コードの知識がほとんどないので想像ですが、使っている環境やテーマなどによっては記述を間違えて[]が多くても対応できるようにしているものと思われます。これだと、上手に表示できているはずの記事なども、実際に訪問者が見たら間違った情報ととらえられてしまうかもしれません。ショートコードは「これ」と案内するのですから、確実にショートコードが見た目に表示されなければ意味がありません。そこで次の方法を使って確実にショートコードをショートコードとして表示させます。これで環境に左右されることなくショートコードの紹介ができるようになりますね。

「文字実体参照」を使うのが一番確実な方法

結論としては、「文字実体参照」を使うのが一番無難だと思われます。
[は[を示すための文字実体参照です。(使うときは半角で入力してください)
これを[の代わりに使うことで、ショートコードがそのまま表示されます。
[ショートコード]
※[を実際に使用するため半角にすると
[table id=3 /]
ときちんとショートコードが平文表示されました。

本来は両方の括弧に文字実体参照を使うのが普通ですが、どちらかの括弧さえ文字として認識されれば「ショートコードではないよ」と認識されるので、先頭のみ変更してやればいいのです。

※記事作成段階では使用しているプラグインを例に挙げて動作確認を紹介していますが、閲覧される際にはプラグインを使っていないためうまく表現ができていない場合がありますがご容赦ください

よく使う文字実体参照については

のサイトに詳しく書かれていました

ショートコードなどを表示して紹介するのに役立つプラグイン

上記で文字実体参照があることは紹介しましたが、記事を書く度にこのコードを入力したり、メモ帳などに保存しておいていちいち引用するのは面倒なので、「Add Quick Tag」プラグインを使ってボタン化してしまうと便利です

いつでもご相談・サイトカスタマイズの依頼を受け付けています

Wordpressのカスタマイズ、不具合解消のご相談はすべてココナラのダイレクトメッセージからお受けしております。まずはこちらのバナーからお気軽にお問い合わせください。

※一度もココナラを使ったことがない方はココナラへの無料登録が必要です。こちらから登録後、上のリンクをクリックする、またはココナラトップページから「ひまあーと」を検索してお問い合わせください。


【スポンサーリンク】


記事の拡散にご協力をお願いします

閲覧いただきありがとうございました。役に立つ情報でしたら是非SNSでシェアをお願いします

関連情報