2026年5月20日

2026年5月20日

WordPressのショートコードが表示されない場合の解決方法

はじめに

記事に

エラー: コンタクトフォームが見つかりません。

と書いたのに、そのまま文字列として表示される、プラグインのショートコードが動かない、ウィジェットエリアでショートコードが効かない。ショートコードが描画されない問題には複数の原因があります。

症状・原因

ショートコードが動作しない主な原因:

  • プラグインが無効:ショートコードを登録しているプラグインが無効化されている
  • テーマのフィルター不足the_contentフィルターが正しくかかっていない
  • ウィジェットでの制限:デフォルトではウィジェットにショートコードが使えない
  • ブロックエディターの問題:クラシックブロックとショートコードブロックの混在
  • 登録前に呼び出し:プラグインのロード前にショートコードを使おうとしている

解決手順

ステップ1:ショートコードが登録されているか確認する

// ショートコードが登録済みかデバッグ確認
add_action('wp_footer', function() {
    if (current_user_can('administrator')) {
        global $shortcode_tags;
        echo '<!-- Registered shortcodes: ';
        echo implode(', ', array_keys($shortcode_tags));
        echo ' -->';
    }
});

WP-CLIで確認:

# 全ショートコードを確認
wp eval 'global $shortcode_tags; print_r(array_keys($shortcode_tags));'

ステップ2:カスタムテンプレートでdo_shortcodeを使う

// page.php や single.php — ショートコードを手動で処理
<?php
$content = get_the_content();
echo apply_filters('the_content', $content);
// または
echo do_shortcode($content);
?>

the_content()ではなくget_the_content()を直接echoしている場合はapply_filtersが必要です。

ステップ3:ウィジェットでショートコードを有効化する

// functions.php — テキストウィジェットでショートコードを有効化
add_filter('widget_text', 'do_shortcode');
add_filter('widget_text_content', 'do_shortcode');

// カスタムHTMLウィジェットでも有効化
add_filter('widget_custom_html_content', 'do_shortcode');

ステップ4:ブロックエディターでショートコードを使う

ブロックエディターでは「ショートコード」ブロックを使います。

1. 「+」ブロック追加 → 「ショートコード」を検索

2. ショートコードブロックにショートコードを入力

3. プレビューで正しく表示されるか確認

または「クラシック」ブロックに切り替えてビジュアルエディターに書く方法もあります。

ステップ5:カスタムショートコードを正しく実装する

// functions.php — ショートコードの正しい実装
add_shortcode('my_button', function($atts, $content = null) {
    // デフォルト属性を設定
    $atts = shortcode_atts([
        'color' => 'blue',
        'url'   => '#',
        'size'  => 'medium',
    ], $atts, 'my_button');
    
    $color = esc_attr($atts['color']);
    $url   = esc_url($atts['url']);
    $label = $content ? esc_html($content) : 'クリック';
    
    // 出力はreturnで返す(echoしない)
    return sprintf(
        '<a href="%s" class="btn btn-%s btn-%s">%s</a>',
        $url, $color, esc_attr($atts['size']), $label
    );
});

// 使い方: [my_button color="red" url="/contact"]お問い合わせ[/my_button]

重要:ショートコードのコールバック内ではechoせず必ずreturnで返してください。echoすると出力位置が意図しない場所になります。

ステップ6:プラグインのショートコードが動かない場合

# プラグインを一つずつ有効化して競合を確認
wp plugin deactivate --all
wp plugin activate contact-form-7
# ショートコードが動くか確認

# 問題のプラグインを特定したら
wp plugin activate all-other-plugins

ステップ7:PHPのショートコードデバッグ

// 独自ショートコードのデバッグ(WP_DEBUGがtrueの環境で)
add_shortcode('debug_test', function($atts) {
    ob_start();
    var_dump($atts);
    return ob_get_clean();
});
// [debug_test key="value"] で属性が正しく渡るか確認

注意事項

  • ショートコードのコールバックは必ずreturnを使い、echoは使わないでください。
  • セキュリティのため、ショートコードで出力するHTMLはesc_html()esc_url()esc_attr()でエスケープしてください。
  • ショートコードはadd_shortcode()を呼ぶプラグインが有効でないと動きません。

まとめ

ショートコードが動かない場合は、プラグインが有効かどうか、テーマがthe_contentフィルターを適用しているかどうかを最初に確認します。ウィジェットではadd_filter('widget_text', 'do_shortcode')を追加することで有効化できます。関連記事:カスタムフィールドが保存できない場合ブロックエディターの使い方

お気軽にご相談ください

お見積りへ お問い合わせへ