他テーマでも、Cocoonのようにパターンをショートコードで呼び出す方法

はじめに

WordPress 5.5から「パターン（再利用ブロック）」が導入され、よく使うコンテンツを登録・再利用できるようになりました。
Cocoonには、これらを便利に扱える独自のパターン一覧画面が用意されており、ショートコードを使って記事内で呼び出すこともできます。

同様の機能を、他のテーマでも実装できるようにします。
この記事では、この方法について説明します。

完成イメージ

使用方法

以下にショートコードを示します。

[my_pattern]

実装手順

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

// ツールバーにメニュー追加
add_action('admin_bar_menu', function ($wp_admin_bar) {
  // 権限チェック
  if (!current_user_can('edit_theme_options')) {
    return;
  }

  $wp_admin_bar->add_menu([
    'id'    => 'admin_menu_patterns',
    'title' => 'パターン一覧',
    'href'  => admin_url('edit.php?post_type=wp_block'),
  ]);
}, 9999);


// 管理画面一覧にカラムを追加
add_filter('manage_edit-wp_block_columns', function ($columns) {
  $columns['shortcode'] = 'ショートコード';

  return $columns;
});


// 管理画面一覧のカラムにデータを表示
add_action('manage_wp_block_posts_custom_column', function ($column_name, $post_id) {
  if ($column_name !== 'shortcode') {
    return;
  }

  $shortcode = '[my_pattern id="' . esc_attr($post_id) . '"]';
  echo '<input type="text" size="20" readonly value="' . esc_attr($shortcode) . '" onclick="this.select();">';
}, 10, 2);


// ショートコードを追加
add_shortcode('my_pattern', function ($atts) {
  $atts = shortcode_atts([
    'id' => null,
  ], $atts);

  if (empty($atts['id'])) {
    return '';
  }

  $post = get_post($atts['id']);
  if (!$post) {
    return '';
  }

  return do_shortcode(do_blocks($post->post_content));
});

さいごに

今回紹介した方法を使えば、WordPressのパターン（再利用ブロック）をショートコードで簡単に呼び出せるようになり、Cocoonテーマの便利なパターン管理機能を他のテーマでも活用できます。
これにより、記事作成の効率化やコンテンツの再利用がよりスムーズになります。