プラグインWooCommerceのwoocommerce_cart_collateralsアクションの使用方法・解説

概要

woocommerce_cart_collateralsは、WooCommerceにおけるカートページのサイドバー部分にカスタムコンテンツを追加するためのフックです。このアクションは、カートの概観をカスタマイズしたり、追加情報やボタンを提供する際に非常に便利です。よく使われる機能としては以下が挙げられます。

割引コードの入力フォームの追加
購入金額に応じた送料無料のお知らせ
おすすめ商品の表示
関連商品の表示
プロモーション情報の表示
お問い合わせボタンの追加

構文

do_action('woocommerce_cart_collaterals');

パラメータ

このアクションにはパラメータはありません。

戻り値

戻り値は特にありませんが、このアクションにフックした関数が実行され、必要なHTMLが出力されます。

利用可能なWooCommerceおよびWordPressのバージョン

WooCommerce: 3.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_action('woocommerce_cart_collaterals', 'add_discount_code_field');

function add_discount_code_field() {
    echo '<div class="discount-code">';
    echo '<h3>割引コードを入力してください</h3>';
    echo '<input type="text" name="discount_code" placeholder="コードを入力">';
    echo '</div>';
}

サンプルコード2: 送料無料のお知らせ

このコードは、特定の金額を超えた場合に表示される送料無料のお知らせを表示します。

add_action('woocommerce_cart_collaterals', 'display_free_shipping_notice');

function display_free_shipping_notice() {
    $threshold = 50; // 50ドル以上で送料無料
    $cart_total = WC()->cart->subtotal;

    if ($cart_total < $threshold) {
        echo '<div class="free-shipping-notice">';
        echo 'あと' . ($threshold - $cart_total) . 'ドルで送料無料です！';
        echo '</div>';
    }
}

サンプルコード3: おすすめ商品の表示

このサンプルコードでは、カートに追加されている商品に基づいておすすめ商品を表示します。

add_action('woocommerce_cart_collaterals', 'show_recommended_products');

function show_recommended_products() {
    $products = wc_get_products(array('limit' => 3, 'orderby' => 'rand'));
    echo '<div class="recommended-products">';
    echo '<h3>おすすめ商品</h3>';
    foreach ($products as $product) {
        echo '<div>' . $product->get_name() . '</div>';
    }
    echo '</div>';
}

サンプルコード4: プロモーション情報の表示

特定のプロモーション情報をカートページに表示する例です。

add_action('woocommerce_cart_collaterals', 'display_promotion_info');

function display_promotion_info() {
    echo '<div class="promotion-info">';
    echo '<h3>今だけ！全商品10%オフセール中！</h3>';
    echo '</div>';
}

サンプルコード5: お問い合わせボタンの追加

カートページにお問い合わせボタンを追加するサンプルコードです。

add_action('woocommerce_cart_collaterals', 'add_contact_button');

function add_contact_button() {
    echo '<div class="contact-button">';
    echo '<a href="/contact" class="button">お問い合わせ</a>';
    echo '</div>';
}

これらのサンプルコードを参考にして、独自のカートページをカスタマイズしてみてください。

概要

構文