プラグインWooCommerceのsingle_product_archive_thumbnail_sizeフィルタの使用方法・解説

概要

single_product_archive_thumbnail_size フィルタは、WooCommerce製品のアーカイブで表示されるサムネイル画像のサイズを調整するために使用されます。このフィルタを使用することで、特定のデザインやレイアウト要件に応じて画像サイズをカスタマイズすることができます。

使用頻度の高い機能

このフィルタは以下のような機能を実装する際によく使用されます：
1. 商品一覧ページのデザイン調整
2. 特定のテーマにおける画像の整列や統一性の確保
3. モバイルデバイス向けに最適化された画像のサポート
4. アピール効果を増すための独自の視覚スタイルの適用
5. SEO対策としての画像サイズ管理
6. 商品種類ごとに異なる画像サイズの設定

構文

add_filter('single_product_archive_thumbnail_size', 'custom_thumbnail_size');
function custom_thumbnail_size($size) {
    return 'medium'; // 例: 輪郭を「medium」に変更
}

パラメータ

$size: 現在のサムネイルサイズの文字列。

戻り値

変更したいサイズの文字列を返します。

WooCommerceとWordPressのバージョン

WooCommerce: すべてのバージョンで使用可能
WordPress: すべてのバージョンで使用可能

この関数のアクションでの使用可能性

アクション	使用例
mu_plugin_loaded
registered_post_type
plugins_loaded
wp_roles_init
setup_theme
after_setup_theme
set_current_user
init
register_sidebar
wp_loaded
send_headers
parse_query
pre_get_posts
wp
template_redirect
get_header
wp_head

サンプルコード

サンプル1: 小さいサムネイルサイズの設定

add_filter('single_product_archive_thumbnail_size', function($size) {
    return 'thumbnail'; // サムネイルを小さく設定
});

このコードは、商品アーカイブのサムネイルサイズを「thumbnail」に変更します。

サンプル2: カスタムサムネイルサイズの設定

add_filter('single_product_archive_thumbnail_size', function($size) {
    return 'custom-size'; // カスタムサイズを指定
});

ここでは、カスタムのサムネイルサイズ「custom-size」を設定します。

サンプル3: 商品カテゴリによる異なるサムネイルサイズ

add_filter('single_product_archive_thumbnail_size', function($size) {
    if (is_product_category('special-category')) {
        return 'large'; // 特殊カテゴリの場合、大きいサイズを設定
    }
    return $size;
});

このコードでは、特定のカテゴリ（special-category）に対して異なるサムネイルサイズを指定します。

サンプル4: 画面幅に応じたサイズ変更

add_filter('single_product_archive_thumbnail_size', function($size) {
    return (wp_is_mobile()) ? 'medium' : 'large'; // モバイルなら中サイズ、それ以外なら大サイズ
});

モバイルデバイスかどうかでサムネイルのサイズを変更する例です。

サンプル5: デフォルトサイズの変更

add_filter('single_product_archive_thumbnail_size', function($size) {
    $default_size = 'medium_large'; // デフォルトサイズを変更
    return $default_size;
});

デフォルトのサムネイルサイズを「medium_large」に変更するサンプルコードです。

概要