WordPress

WordPress ショートコードをエスケープする方法

投稿日:2017年8月18日 更新日:

Wordpress Logo

ショートコードを使っているプラグインは結構あります。Table of Contents PlusやPz-LinkCardなどがそうです。さて、これらのショートコードを投稿に載せるときにどうしていますか?[toc]を文字として打ち出そうとすると目次に変換されてしまって困ったりしていませんか?エスケープするのにはどうすればよいのでしょうか?

komatta_man2

知ってる人にとっては本当にくだらない内容と思います。しかし、知らない人もいるのです。

<スポンサーリンク>

ショートコードとは?

半角のカッコで括られた命令のようなものです。編集している間はただの文字ですが、公開する際に準備されたコードによって意味のある文字列に変換されます

例えば、Table of Contents Plusでは以下のようなショートコードを用いています。

[toc]

[toc heading_levels=2]

何が問題なのか?

文字列として”[”と”]”で括られているものをショートコードと認識します。もちろん括弧の中の文字は定められている文字列です。それらは置換されてしまうので、[toc]のように文字として打ち出す際にエスケープしてあげる必要があります。

前述しているような  [toc] は当たり前のように表示されていますが、普通に[toc]と書いてしまうと、目次に変換されます。従って、

”ショートコードは[toc]のように書くのです!”

のような文章を書くのが難しいのです。

 

もちろん最初は私もわからなくて、超悩みました。

 

あるサイトではきちんと[toc]のように表示されていたり、よくよく見るとそれは画像だったりしていました。

もちろん、私の投稿はきちんと文字になっています。よければご覧ください。

<code></code>でエスケープできるんじゃないのか?

できないんですね。

私も最初は深く考えずにこんな感じにやってみました。

<code>[toc]</code>

見事にエスケープされず、目次になりました。しかし、これが正解なのではないかと思って、これで結構粘りましたね。(苦)

&とか付ければいいんじゃないの?

さすがにこれが正解だとは思いませんでしたが・・・

 

一応、やってみました。

 

もちろんできませんでした。(汗)

エスケープの正解はこれだ

正解はこれです。

[[toc]]

きちんと調べれば書いてあるんです。

WordPress Codex日本語版 ショートコード

中段ぐらいに以下の記載があります。

投稿の中でふつうはショートコードを表す文字列をただの文字列として使いたい場合があります。そうするには1組ではなく2組のかぎかっこを使ってショートコードをエスケープする必要があります。例えば次のように投稿内に表示するには:

[gallery]

次のように書きます:

[[gallery]]

開始タグと終了タグを持つショートコードの場合は、一番最初と一番最後のかぎかっこをエスケープする必要があります:

[[shortcode] … [/shortcode]]

引用元:WordPress Codex 日本語版 ショートコードより

もちろん、上記の引用もそのままコピー&ペーストすると括弧が足りない(gallery で変換されてしまう)ので、括弧[]を足してあげています。

追記:2017/08/24

開始タグと終了タグを持つショートコードの場合、こちらの表記の方が正しいかもしれません。

[[[shortcode] … [/shortcode]]]

<スポンサーリンク>

まとめ

最初はわからないのは当たり前なので恥ずかしいことではないのです。

しかし、意外にこのような常識がわからなかったりもするのです。この投稿見て”ハッ!”とする人もいるんじゃないかと思っています。

そして、こういうニッチな話はネットで見つけにくかったりします。実際に私はこの情報に中々当たりませんでした。

  • ショートコードをエスケープしたい場合は括弧を重ねる
  • <code></code>で囲ってもエスケープできない

お役に立てば嬉しいです。

-WordPress
-

執筆者:

<スポンサーリンク>

comment

メールアドレスが公開されることはありません。

*

関連記事

Popularposts-logo

ランキングを作成するプラグイン WordPress Popular Posts (WPP)

投稿にランキングを付けているサイトがよくあるので、興味本位で私もやってみました。ランキングを作るにはWordPress Popular Posts (WPP)というプラグインを使えばかなり簡単にできます。インストール/有効化から設定までまとめましたので参考にし …

BackToTop-eye2

WordPress トップに戻るボタンの設置 プラグイン比較

文字数が多い投稿が増えたので、トップに戻るボタンが欲しくなりました。プラグインを見ていると似たような名前のトップに戻るボタン設置プラグインが沢山あります。5つのプラグインを試して、比較してみましたので、参考にしてください。 ※ 2017年10月時点の情報に確認 …

WordPress 日本語環境で必須のプラグイン WP Multibyte Patch

WordPress環境で「なぜか文字数が合わない、揃わない」なんて経験はありませんか?これは英語ベースで作られている環境の文字(シングルバイト)と日本語(ダブルバイト)の文字の違いから来るものです。この文字の問題を解決してくれるプラグインがWP Multiby …

YoastSEO-logo

月別アーカイブが301リダイレクトされてしまう現象の解決

いつの間にか月別アーカイブが301リダイレクトされる状態になっていました。気づいたのはBing Web マスターツールのクロール情報で”HTTP301コード”に出ていたからです。実際に自分で月別アーカイブを確認してみると確かにリダイレクトされていました。問題解 …

UpdraftPlus BackupRestore eye

WordPress 超簡単バックアップ UpdraftPlus – Backup/Restore

そろそろWordPress環境のバックアップもきちんとしなければならないと思って、バックアップ/リストアのプラグインを入れました。選択したプラグインは UpdraftPlus – Backup/Restore です。超簡単にできるプラグインなのでお …

サイト内の検索はこちらから

サイト内の検索はこちらから

サイト内の検索はこちらから

カテゴリー

アーカイブ

最近の投稿

RSS icon


Scroll Up