【WordPress】「ショートコード」を「カスタムフィールド」で使う方法の備忘録

とっちゃん@nyanco! です。

今回はWordPress（ワードプレス）の「ショートコード」を「カスタムフィールド」で使えるようにする方法の備忘録です。

デフォルトでは「カスタムフィールド」に「ショートコード」は使えない

「ショートコード」とっても便利だけど、もしかして「カスタムフィールド」では使えないのですかにゃ〜？

▼「ショートコード」を「カスタムフィールド」に入力すると、[test] のように入力したそのままで表示されてしまいます。

そう、WordPressのデフォルトでは「カスタムフィールド」に「ショートコード」は使えない仕様となっています。

「カスタムフィールド」に「ショートコード」を使えるようにする方法

▼通常、「カスタムフィールド」を出力したい場合は、テーマファイルの「カスタムフィールド」を出力したい箇所に下記のように記述します（例として「custom_field」というフィールド名のカスタムフィールドを出力しています）。

<p>
 <?php echo get_post_meta( get_the_ID(), 'custom_field' ,true ); ?>
</p>

▼「ACF（Advanced Custom Fields）」で作成した「カスタムフィールド」ならもっとシンプルです。

<p>
 <?php the_field('custom_field'); ?>
</p>

ちなみに「the_field()」はACF専用の関数ですにゃ〜

▼「ショートコード」が使えるようにするには、下記のように変更します。

<p>
 <?php echo apply_filters('the_content', get_post_meta( get_the_ID(), 'custom_field', true));?>
</p>

ACF専用の関数「the_field()」だとできないのでWordPress関数の「get_post_meta」を使いますにゃ〜

これで、「カスタムフィールド」にも「ショートコード」の内容が出力されるようになります！

参考にさせていただいたサイト様

WordPressのカスタムフィールドでショートコードを使う

日曜日なので軽い話題。WordPressのカスタムフィールド内でショートコードを利用する方法です。あまり使う事も無いかもしれませんが、ショートコードを多用する方には利用価値がありそうです。

kachibito.net

ありがとうございますにゃ〜

「ショートコード」が勝手にpタグで囲まれてしまう時の対処法

「カスタムフィールド」で「ショートコード」が使えるようになったけど、今度は「ショートコード」で出力した内容が勝手に「pタグ」で囲まれてしまうという現象に悩まされましたが、下記サイト様の記事で解消しました！ありがとうございます！

WordPressでショートコードがｐタグで囲まれたり改行されてしまうのを防ぐ方法

僕はWordPressに投稿する場合、基本的にテキストエディターを使ってHTMLタグも手で打ったりAddquicktagに登録したものを使ったりしているので、ショートコードとは無縁のWPライフを送ってきました。しかし、最近ブロガーさんやWebメディア運営に力を入れている会社さんからの制作依頼が増え、それに伴い「ビジュア

bambooworks.co

おわりに

そもそも「カスタムフィールド」に「ショートコード」を使いたいなんてニッチなニーズなのかも知れませんが、「ショートコード」を多用している方には参考になるかと！

本記事がどなたかの参考になれば幸いです。

今回は以上となります。
最後まで読んでいただきましてありがとうございました！
それではまた〜✧٩(ˊωˋ*)و✧