WooCommerce の Ajaxify ヘッダー カート アイテム数

ニーズの特定

WooCommerce 統合 WordPress テーマでヘッダー カートを更新するページをリロードせずにアイテム数をカウントするのは一般的な課題です。 jQuery は解決策を提供しますが、アイテムを複数の数量で追加できる場合には疑問が生じます。

AJAX を使用して合計数を取得する

PHP からカートの合計数を動的に取得するにはjQuery を使用したセッションでは、値をエコーする reloadCart.php ファイルが作成されます:

cart->get_cart_contents_count();
?>

AJAX 実装

ただし、jQuery の get()、post()、または ajax() 関数を使用してこのファイルへの AJAX 呼び出しを行う試みは失敗しました。 .

改善されたアプローチ

リロードに依存する代わりに、WooCommerce は Ajax をサポートする専用の woocommerce_add_to_cart_fragments アクション フックを提供します。

HTML 統合

一意の ID またはクラスを使用してヘッダーにカート数を埋め込みます:

$items_count = WC()->cart->get_cart_contents_count(); 
?>
    

PHP コード
次のコードをテーマの function.php ファイルまたはプラグインに実装します:
add_filter( 'woocommerce_add_to_cart_fragments', 'wc_refresh_mini_cart_count');
function wc_refresh_mini_cart_count($fragments){
    ob_start();
    $items_count = WC()->cart->get_cart_contents_count();
    ?>
    

    
クラスを使用する場合は #mini-cart-count を .mini-cart-count に置き換えます。
jQuery Refresh
追加の jQuery 更新の場合は必須です:
$(document.body).trigger('wc_fragment_refresh');
or
$(document.body).trigger('wc_fragments_refreshed');