Thêm trường số lượng và nút thêm vào giỏ ra trang shop – woocommerce

Thêm trường số lượng và nút thêm vào giỏ ra trang shop – woocommerce-24h68

Tạo form html gồm chọn số lượng và nút add to cart

<?php
function isures_custom_quantity_field_archive()
{
 
    global $product;
    if ($product->is_type('simple')) {
        echo '<div class="isures-custom--qty_wrap">';
        echo '<div class="isures-qtv--wrap">';
        woocommerce_quantity_input(array('min_value' => 1, 'max_value' => $product->backorders_allowed() ? '' : $product->get_stock_quantity()));
        echo '</div>';
        woocommerce_template_loop_add_to_cart();
        echo '</div>';
    }
}
 
add_action('woocommerce_after_shop_loop_item', 'isures_custom_quantity_field_archive', 15, 9);
?>

Code trên sẽ hook vào woocommerce_after_shop_loop_item. Nếu bạn muốn thay đổi vị trí khác có thể tham khảo các hook archive shop khác thay thế woocommerce_after_shop_loop_item ở code trên.

Nguồn hook: businessbloomer.com

图片[1]-

Ví dụ thêm hook:

<?php
add_action('woocommerce_after_shop_loop_item_title', 'isures_after_shop_loop_item_title_func');
 
function isures_after_shop_loop_item_title_func()
{
    // code cái gì đó hiện thị ra phía người dùng
    echo '<p>Thêm 1 cái gì đó</p>';
}
?>

Thêm một chút CSS để làm đẹp

<?php
add_action('wp_footer', 'isures_quantity_reg_style');
 
function isures_quantity_reg_style()
{
?>
    <style>
        .isures-custom--qty_wrap {
            display: flex;
            align-items: center;
            justify-content: space-between;
        }
 
        .isures-custom--qty_wrap .ajax_add_to_cart {
            font-size: 12px;
            margin: 0;
            padding: 10px 15px;
            min-height: auto;
            line-height: 1.5;
        }
    </style>
    <?php
}
?>

Js xử lý field số lượng khi thay đổi

<?php
function isures_custom_add_to_cart_quantity_handler()
{
    wc_enqueue_js('
jQuery( "body" ).on( "click", ".quantity input", function() {
return false;
});
jQuery( "body" ).on( "change input", ".quantity .qty", function() {
var add_to_cart_button = jQuery( this ).parents( ".product" ).find( ".add_to_cart_button" );
add_to_cart_button.attr( "data-quantity", jQuery( this ).val() );
add_to_cart_button.attr( "href", "?add-to-cart=" + add_to_cart_button.attr( "data-product_id" ) + "&quantity=" + jQuery( this ).val() );
});
');
}
add_action('init', 'isures_test_luoi');
?>

Tới đây là lỗi nè.

Thay thế isures_test_luoi bằng isures_custom_add_to_cart_quantity_handler.

Mục đích mình ấy ấy như vậy là để mọi người không làm kiểu khoa loa, copy paste mà không hiểu vấn đề.

Oke như thế là đã good rồi đấy. 

Nguồn: Lê Văn Thắng

Thêm trường số lượng và nút thêm vào giỏ ra trang shop – woocommerce-24h68
© 版权声明
THE END
喜欢就支持一下吧
点赞0
分享
Theo dõi
Thông báo của
的头像-24h68
0 Comments
Cũ nhất
Mới nhất Được bỏ phiếu nhiều nhất
Phản hồi nội tuyến
Xem tất cả bình luận