WordPressで管理画面の投稿一覧にACFでセットした画像の「あり・なし」を表示させる方法

Filed under: functions.php — kdcs @ 25年8月8日 金曜日

投稿やカスタム投稿でAdvanced Custom Fieldsを使って画像をアップロードしてページに掲載する場合、画像の設定が必須でないときは画像があったり無かったりするので投稿一覧でその「あり・なし」が分かるようにしたい。

functions.phpに記述
例はrestaurant_menuというカスタム投稿タイプでACFの画像フィールド名はrestaurant_menu_image

// カラムを追加
add_filter('manage_restaurant_menu_posts_columns', 'add_menu_image_column');
function add_menu_image_column($columns) {
    $columns['menu_image'] = '画像あり';
    return $columns;
}

// カラムの内容を表示
add_action('manage_restaurant_menu_posts_custom_column', 'show_menu_image_column', 10, 2);
function show_menu_image_column($column, $post_id) {
    if ($column === 'menu_image') {
        $image = get_field('menu_image', $post_id); // ACFの画像フィールド名
        if ($image) {
            echo '画像あり';
        } else {
            echo '画像なし';
        }
    }
}

]/php]

【未検証】(実際は'menu_image'もACFの画像フィールド名と同じ'restaurant_menu_image'にして実装した)
たぶん、一覧にカラムを追加するときにカラム名を'menu_image'にする場合は、項目の並べ替えの時にも'menu_image'を使う。

一覧にサムネイル画像を表示させる場合
<span id="more-2325"></span>

サムネイルの画像サイズをcssで横80px縦60pxにした場合
[php]
// カラムを追加
add_filter('manage_restaurant_menu_posts_columns', 'add_menu_image_column');
function add_menu_image_column($columns) {
    $columns['menu_image'] = 'メニュー画像';
    return $columns;
}

// カラムの内容を表示
add_action('manage_restaurant_menu_posts_custom_column', 'show_menu_image_column', 10, 2);
function show_menu_image_column($column, $post_id) {
    if ($column === 'menu_image') {
        $image = get_field('menu_image', $post_id); // ACFの画像フィールド名
        if ($image) {
            // サムネイルサイズで表示(ACFは画像配列を返す)
            echo '<img src="' . esc_url($image['sizes']['thumbnail']) . '" alt="" style="width:80px; height:60px; object-fit:cover;">';
        } else {
            echo '画像なし';
        }
    }
}

サイト内検索

カテゴリー

最近の投稿

« |WordPressで管理画面の投稿一覧にACFでセットした画像の「あり・なし」を表示させる方法| »
↑上に戻る