【WordPress】カテゴリーごとに異なるデフォルトのサムネイル画像を表示する方法

WordPressでは投稿にアイキャッチ画像（サムネイル）を設定していない場合、何も表示されずデザインが崩れてしまうことがあります。

そこで本記事では、カテゴリーごとに異なる「デフォルトのサムネイル画像」 を表示する方法をご紹介します。

実現方法の概要

• 投稿にアイキャッチ画像がある場合はそれを表示
• アイキャッチ画像がない場合は、投稿の属するカテゴリーに応じてデフォルト画像を表示
• スラッグやIDに応じて分岐させることで実装します

コード例：カテゴリー別にデフォルト画像を表示

以下は、the_post_thumbnail() の代わりに使用するカスタム関数の実装例です。

<?php
function get_category_based_thumbnail($size = 'medium') {
  if (has_post_thumbnail()) {
    // アイキャッチ画像が設定されていればそれを表示
    the_post_thumbnail($size);
  } else {
    // 投稿のカテゴリーを取得
    $categories = get_the_category();
    $cat_slug = $categories ? $categories[0]->slug : '';

    // カテゴリーごとのデフォルト画像
    switch ($cat_slug) {
      case 'news':
        $default_thumb = get_template_directory_uri() . '/images/thumb-news.jpg';
        break;
      case 'event':
        $default_thumb = get_template_directory_uri() . '/images/thumb-event.jpg';
        break;
      case 'blog':
        $default_thumb = get_template_directory_uri() . '/images/thumb-blog.jpg';
        break;
      default:
        $default_thumb = get_template_directory_uri() . '/images/thumb-default.jpg';
        break;
    }

    // 画像を出力
    echo '<img src="' . esc_url($default_thumb) . '" alt="" class="category-default-thumbnail">';
  }
}
?>

使用方法（テンプレート内）

<?php get_category_based_thumbnail('medium'); ?>

カスタマイズのポイント

• カテゴリーが複数ある場合、$categories[0] によって最初のカテゴリが使われます
• slug の代わりに term_id を使ってもOKです
• get_template_directory_uri() を使ってテーマ内画像を指定しています

応用：ACFでカテゴリごとのデフォルト画像を柔軟に管理する方法

カスタムフィールドを使えば、管理画面から画像を自由に差し替えられます。

1. ACFで「画像」フィールドを作成し、タクソノミー「カテゴリー」に適用
2. フィールド名を category_default_image と仮定
3. 以下のコードで画像を取得

<?php
$categories = get_the_category();
if ($categories) {
  $cat_id = $categories[0]->term_id;
  $default_image = get_field('category_default_image', 'category_' . $cat_id);
  if ($default_image) {
    echo '<img src="' . esc_url($default_image['url']) . '" alt="" class="category-default-thumbnail">';
  }
}
?>

まとめ

投稿にアイキャッチ画像が設定されていない場合でも、カテゴリーごとに適したサムネイルを表示することで、見た目の統一感とユーザー体験の向上が図れます。
シンプルな switch 分岐でも十分ですが、ACFを使えばノーコードでの変更も可能です。
ぜひ用途に合わせて取り入れてみてください。