【WordPress】ウィジェットを記事本文内などに表示させる方法

当サイトのトップページをカスタマイズする際、固定ページの投稿画面からカスタマイズできるようにしたくて色々試行錯誤した結果、ウィジェットを記事本文内に表示させることができればいける！ と思い、実装してみました。

実装するとこんな感じです

実装するとこんなウィジェットエリアが出現します。好きなウィジェットを追加すれば、ショートコードを使える場所ならどこにでも表示させることができます。

実装する方法

作業の流れ

まず新しいウィジェットエリアを追加して、それを実行するための PHP ファイルを作り、最後にその PHP ファイルを呼び出すためのショートコードを実装します。

ウィジェットエリアとショートコードの実装は function.php で行うので、先にまとめてコピペしてしまいましょう。

ウィジェットエリアを作る

WordPress のウィジェット設定画面に新しいウィジェットエリアを追加します。子テーマの function.php に以下をコピペしてください。

//ショートコード化のためのウィジェット
register_sidebar( array(
'id' => 'custom_shortcord', //このウィジェットエリアのID名
'name' => 'ショートコード化するウィジェット', //設定画面でのタイトル
'description' => 'ここに追加したウィジェットを、記事内などにショートコードで表示させることができます。', //設定画面の説明欄
'before_widget' => '<div class="custom_sc">', //ウィジェットの前に出力されるタグ
'after_widget' => '</div>', //ウィジェットの後に出力されるタグ
) );

PHP ファイルを呼び出すショートコードを作る

[ショートコード名 file="ファイル名"] で、指定したファイルを呼び出すショートコードを実装します。
こちらも子テーマの function.php にコピペしてください。

//ファイルを呼び出すショートコード
function add_widget_func($params = array()) {
extract(shortcode_atts(array(
'file' => 'default'
), $params));
ob_start();
get_template_part($file,'');
return ob_get_clean();
}
add_shortcode('add_widget', 'add_widget_func'); //前半部分がショートコード名になります

ウィジェットを実行するファイルを作る

<?php dynamic_sidebar('custom_shortcord'); ?>

新規ファイルにこの1行をコピペして「custom_widget.php」という名前で保存するか、下のボタンからファイルをダウンロードしてください。

ダウンロードした ZIP ファイルを展開すると、「custom_widget.php」というファイルが入っています。

このファイルをテーマ直下（wp-content＞themes＞使用テーマ のフォルダ内）にアップロードしてください。

使い方

あとはウィジェットの設定画面からウィジェットエリアに使いたいウィジェットを追加して、表示させたい場所にショートコードを記述するだけです。

ウィジェットを追加する

今回作った新しいウィジェットエリアに、使用したいウィジェットを追加していきます。
サイドバーに表示する時と同じく、タイトルや表示件数なども反映されるので、使う場所や使い方に合わせて設定してください。

ショートコードでウィジェットを呼び出す

このウィジェットを呼び出すショートコードは
[add_widget file="custom_widget"]
になります。

「add_widget」の部分がショートコード名、「custom_widget」がファイル名（拡張子を取ったもの）です。

記事本文内やショートコードを使うことができるテキストエリアなど、好きな場所に記述してウィジェットを呼び出すことができます。

便利な小ネタ

複数のウィジェットエリアを作る

ウィジェットエリアとそれを実行する PHP ファイルがセットになっている（ショートコードはファイルを呼び出すだけ）ので、ウィジェットエリアの ID とファイル名を変更して複数セット作成すれば、ショートコードの部分は使い回しが可能です。

条件分岐も簡単

ウィジェット化により、「Widget Logic」などのプラグインを使って、特定のカテゴリ・記事でだけ表示させるというような条件分岐も簡単にできるので、広告や CTA の管理などにも使えると思います。