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

概要

product_cat_classは、WooCommerceにおける商品カテゴリのクラス名をカスタマイズするためのフィルターフックです。このフィルタを利用することで、開発者は商品のカテゴリに対して特定のCSSクラスを追加し、スタイルやJavaScriptの挙動を制御することができます。主な使い道としては以下が挙げられます。

カテゴリ毎にデザインを変更したい場合。
JavaScriptのイベントを特定のカテゴリにだけ適用したい場合。
特定のCSSスタイルをカテゴリ毎に適用する場合。
カテゴリの表示に特化したIGA(インタラクティブでグラフィカルな要素)を管理する場合。
SEO対策として特定のクラス名を付加したい場合。
ブランドやキャンペーンに基づくクラスを追加したい場合。

構文

apply_filters( 'product_cat_class', $classes, $category );

パラメータ

$classes: 既存のカテゴリクラスの配列。
$category: 現在のカテゴリオブジェクト。

戻り値

カスタマイズされたカテゴリクラスの配列。

バージョン情報

WooCommerce: バージョン 2.1.0以降
WordPress: バージョン 4.0以降

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

アクション	使用例
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( 'product_cat_class', 'add_custom_class_to_product_categories', 10, 2 );
function add_custom_class_to_product_categories( $classes, $category ) {
    $classes[] = 'my-custom-class';
    return $classes;
}

このコードは、全ての商品カテゴリに「my-custom-class」を追加します。

サンプル2: 特定のカテゴリにのみクラスを追加する

add_filter( 'product_cat_class', 'conditional_class_for_specific_category', 10, 2 );
function conditional_class_for_specific_category( $classes, $category ) {
    if ( $category->slug === 'special-category' ) {
        $classes[] = 'special-category-class';
    }
    return $classes;
}

このコードは、「special-category」というスラッグを持つカテゴリにだけ「special-category-class」を追加します。

サンプル3: カテゴリ名によって異なるクラスを付与

add_filter( 'product_cat_class', 'dynamic_classes_based_on_name', 10, 2 );
function dynamic_classes_based_on_name( $classes, $category ) {
    if ( strpos( $category->name, 'Sale' ) !== false ) {
        $classes[] = 'on-sale';
    }
    return $classes;
}

このコードは、カテゴリ名に「Sale」が含まれる場合に「on-sale」クラスを追加します。

サンプル4: 複数の条件でクラスを付与する

add_filter( 'product_cat_class', 'multi_condition_classes', 10, 2 );
function multi_condition_classes( $classes, $category ) {
    if ( $category->term_id == 12 ) {
        $classes[] = 'featured-category';
    }
    if ( $category->count > 10 ) {
        $classes[] = 'large-count';
    }
    return $classes;
}

このコードは、特定のカテゴリIDを持つカテゴリに「featured-category」クラスを追加し、商品数が10を超えるカテゴリに「large-count」クラスを追加します。

サンプル5: カテゴリの階層に基づくクラスの追加

add_filter( 'product_cat_class', 'hierarchical_class_based_on_category', 10, 2 );
function hierarchical_class_based_on_category( $classes, $category ) {
    if ( $category->parent == 0 ) { // 親カテゴリの場合
        $classes[] = 'parent-category';
    } else {
        $classes[] = 'child-category';
    }
    return $classes;
}

このコードは、親カテゴリに「parent-category」を、子カテゴリには「child-category」を追加します。

概要

構文