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

概要

woocommerce_$TYPEfields フィルタは、WooCommerce の特定のデータ入力フィールドにカスタムフィールドを追加または編集するために使用されるフックです。このフィルタは、主に以下のような機能を実装する際によく使われます。

商品情報の拡張
カスタムチェックボックスやラジオボタンの追加
配送情報のカスタマイズ
顧客アカウントページのフィールドの変更
注文詳細ページにカスタムデータを追加
カートページのフィールドの調整

構文

add_filter( 'woocommerce_$TYPEfields', 'your_function_name', 10, 2 );

パラメータ

$TYPE: 対象のフィールドタイプ（例：product, order, customer など）
$fields: 変更対象のフィールド配列
return: 編集されたフィールド配列

戻り値

編集されたフィールド配列（配列型）

使用可能なWooCommerceのバージョン

WooCommerce 3.0以降

使用可能なWordPressのバージョン

WordPress 4.7以降

サンプルコード

サンプル1: 商品情報のカスタムフィールド追加

このサンプルコードは、商品情報にカスタムフィールド「カスタムテキスト」を追加します。

add_filter( 'woocommerce_product_fields', 'add_custom_product_field' );

function add_custom_product_field( $fields ) {
    $fields['custom_text'] = array(
        'type'        => 'text',
        'label'       => __( 'カスタムテキスト', 'woocommerce' ),
        'description' => __( '商品に関連するカスタムテキストを入力してください。', 'woocommerce' ),
        'required'    => false,
    );
    return $fields;
}

引用元: https://docs.woocommerce.com/document/tutorial-customising-product-fields/

サンプル2: 配送情報へのカスタムフィールド追加

このコードは、配送情報に「お届け希望日時」フィールドを追加します。

add_filter( 'woocommerce_shipping_fields', 'add_delivery_date_field' );

function add_delivery_date_field( $fields ) {
    $fields['delivery_date'] = array(
        'label' => __('お届け希望日時', 'woocommerce'),
        'required' => true,
        'class' => array('form-row-wide'),
    );
    return $fields;
}

引用元: https://www.sitepoint.com/woocommerce-custom-checkout-fields/

サンプル3: 注文詳細ページへのカスタム情報の追加

このサンプルコードは、管理画面の注文詳細ページにカスタムフィールドを表示させます。

add_filter( 'woocommerce_order_fields', 'add_custom_order_field' );

function add_custom_order_field( $fields ) {
    $fields['custom_info'] = array(
        'label' => __( 'カスタム情報', 'woocommerce' ),
        'required' => false,
        'class' => array('form-row-wide'),
        'clear' => true,
    );
    return $fields;
}

引用元: https://www.businessbloomer.com/woocommerce-custom-order-fields/

サンプル4: カートページのフィールド調整

カートページにカスタムチェックボックスを追加する例です。

add_filter( 'woocommerce_cart_fields', 'add_custom_cart_checkbox' );

function add_custom_cart_checkbox( $fields ) {
    $fields['custom_checkbox'] = array(
        'type' => 'checkbox',
        'label' => __( 'カスタムチェックボックス', 'woocommerce' ),
        'required' => false,
        'class' => array('form-row-wide'),
    );

    return $fields;
}

引用元: https://www.webdevdoor.com/woocommerce/adding-custom-fields-to-cart-page/

サンプル5: 顧客アカウントページのフィールド変更

顧客アカウントページに新しいフィールドを追加する例です。

add_filter( 'woocommerce_account_fields', 'add_custom_account_field' );

function add_custom_account_field( $fields ) {
    $fields['custom_account_field'] = array(
        'type' => 'text',
        'label' => __( 'カスタムアカウントフィールド', 'woocommerce' ),
        'required' => false,
        'class' => array('form-row-wide'),
    );
    return $fields;
}

引用元: https://www.wpbeginner.com/plugins/how-to-add-custom-fields-to-woocommerce-account-page/

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

アクション	使用可能性
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

概要

構文