WooC Commerce thêm vào số lượng giỏ hàng

WooC Commerce có thể được sử dụng với nhiều chủ đề WordPress và mỗi chủ đề có một cách bố trí và tạo kiểu khác nhau cho các tính năng khác nhau. Trong bài viết này, chúng ta sẽ nói về tính năng số lượng, cụ thể hơn là các nút bấm tăng giảm số lượng của một sản phẩm trước khi thêm vào Giỏ hàng, hoặc khi cập nhật Giỏ hàng. Mặc dù ở nhiều chủ đề, các nút số lượng WooC Commerce này được biểu thị bằng các dấu “+” và “-” để thêm và giảm số lượng tương ứng, các chủ đề như chủ đề Storefront hiển thị các mũi tên lên và xuống giống nhau, theo mặc định [xem hình ảnh . Đối với các chủ đề như vậy, hãy khám phá cách thêm các nút + và – vào đầu vào số lượng WooC Commerce trên trang sản phẩm

Có nhiều cách để làm điều này tôi. e. sử dụng plugin hoặc đoạn mã

Sử dụng đoạn mã để thêm các nút cộng + và trừ – vào đầu vào số lượng WooC Commerce trên trang sản phẩm

Bạn có thể sử dụng một đoạn mã đơn giản bao gồm PHP, JQuery và CSS để thêm các nút dấu cộng [+] và [-] thay cho mũi tên lên và xuống để tăng và giảm số lượng tương ứng. Bắt đầu với việc thêm các đoạn mã PHP & JQuery bên dưới vào các chức năng. tệp php của chủ đề con của bạn

add_action[ 'woocommerce_after_add_to_cart_quantity', 'ts_quantity_plus_sign' ];
 
function ts_quantity_plus_sign[] {
   echo '+';
}
 
add_action[ 'woocommerce_before_add_to_cart_quantity', 'ts_quantity_minus_sign' ];

function ts_quantity_minus_sign[] {
   echo '-';
}
 
add_action[ 'wp_footer', 'ts_quantity_plus_minus' ];
 
function ts_quantity_plus_minus[] {
   // To run this on the single product page
   if [ ! is_product[] ] return;
   ?>
   
          
      jQuery[document].ready[function[$]{   
          
            $['form.cart'].on[ 'click', 'button.plus, button.minus', function[] {
 
            // Get current quantity values
            var qty = $[ this ].closest[ 'form.cart' ].find[ '.qty' ];
            var val   = parseFloat[qty.val[]];
            var max = parseFloat[qty.attr[ 'max' ]];
            var min = parseFloat[qty.attr[ 'min' ]];
            var step = parseFloat[qty.attr[ 'step' ]];
 
            // Change the value if plus or minus
            if [ $[ this ].is[ '.plus' ] ] {
               if [ max && [ max = val ] ] {
                  qty.val[ min ];
               } 
               else if [ val > 1 ] {
                  qty.val[ val - step ];
               }
            }
             
         }];
          
      }];