自動で記事上・記事下、記事中ウィジェットを追加する方法【投稿ページ限定】

WordPressテーマで、投稿ページの本文上・本文下、記事中に専用のウィジェットエリアを追加する方法を紹介します。
このコードは「投稿ページのみに反映」されるため、お知らせ・固定ページ・アーカイブ・カテゴリ一覧などには影響しません。

1 実装のポイント

• 記事上と記事下、記事中にそれぞれ独立したウィジェットエリアを追加
• Lightning標準の構造を崩さず、シンプルに自動挿入
• 投稿（post）のみに限定して動作

2 functions.php にコードを追加

子テーマの functions.php に以下のコードを追加します。

//------------------------------------------------
// Lightning：記事上・記事下・記事中ウィジェットを追加
//------------------------------------------------
add_action('widgets_init', function() {
    register_sidebar([
        'name'          => '記事上ウィジェット',
        'id'            => 'post-top-widget',
        'description'   => '投稿本文の前に表示されるウィジェットエリアです。',
        'before_widget' => '<div id="%1$s" class="widget %2$s">',
        'after_widget'  => '</div>',
        'before_title'  => '<h3 class="widget-title">',
        'after_title'   => '</h3>',
    ]);
    register_sidebar([
        'name'          => '記事下ウィジェット',
        'id'            => 'post-bottom-widget',
        'description'   => '投稿本文の下に表示されるウィジェットエリアです。',
        'before_widget' => '<div id="%1$s" class="widget %2$s">',
        'after_widget'  => '</div>',
        'before_title'  => '<h3 class="widget-title">',
        'after_title'   => '</h3>',
    ]);
    register_sidebar([
        'name'          => '記事中ウィジェット',
        'id'            => 'post-middle-widget',
        'description'   => '記事途中（ショートコードで挿入）に表示されるウィジェットエリアです。',
        'before_widget' => '<div id="%1$s" class="widget %2$s">',
        'after_widget'  => '</div>',
        'before_title'  => '<h3 class="widget-title">',
        'after_title'   => '</h3>',
    ]);
});

//-------------------------------------------
// 記事上・記事下・記事中ウィジェットを自動挿入
//-------------------------------------------
add_filter('the_content', function($content) {
    if (is_single()) {

        // 記事上ウィジェット
        if (is_active_sidebar('post-top-widget')) {
            ob_start();
            dynamic_sidebar('post-top-widget');
            $top_widget = ob_get_clean();
            $content = '<div class="post-top-widget-area">' . $top_widget . '</div>' . $content;
        }

        // 記事下ウィジェット
        if (is_active_sidebar('post-bottom-widget')) {
            ob_start();
            dynamic_sidebar('post-bottom-widget');
            $bottom_widget = ob_get_clean();
            $content .= '<div class="post-bottom-widget-area">' . $bottom_widget . '</div>';
        }
    }
    return $content;
});

//-------------------------------------------
// 記事中ウィジェット用ショートコード
//-------------------------------------------
add_shortcode('middle_widget', function() {
    if (is_active_sidebar('post-middle-widget')) {
        ob_start();
        dynamic_sidebar('post-middle-widget');
        return '<div class="post-middle-widget-area">' . ob_get_clean() . '</div>';
    }
});

記事の途中でショートコードの内容を表示する場合：

[middle_widget]
  

3 完成イメージ

4 代用プラグイン

同様のことをGUIで行いたい場合は、以下のプラグインも便利です。

• Widget Options – 投稿タイプごとにウィジェット表示を制御可能。
• Content Aware Sidebars – 条件分岐で記事上・下・中に自由に配置。
• Insert Pages – 記事中はページにショートコードで挿入する。

5 まとめ

• この記事のコードを子テーマの functions.php に追加するだけでOK
• 「記事上」「記事下」「記事途中」のウィジェットが管理画面に自動追加
• 記事中のウィジェットの内容は [middle_widget]で任意の記事途中にショートコードを入力すると表示されます。
• 投稿ページ専用なので、他のページには影響しない安全設計

この実装で、Lightningでも簡単に記事上・記事下・記事中に自由なウィジェットエリアを増やすことができます。
お知らせや固定ページに影響を与えず、投稿記事専用のデザインが可能です。