1. Giới Thiệu Code Tự động Cập Nhật Giá Khi Tăng Giảm Số Lượng
Việc tự động cập nhật giá khi thay đổi số lượng sản phẩm giúp người dùng cộng/trừ số lượng một cách trực quan hơn, góp phần nâng cao trải nghiệm mua sắm. Code dưới đã được kiểm tra và hoạt động tốt trên WooCommerce.
2. Code Tự động Cập Nhật Giá
Chèn code sau vào file functions.php
của theme:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 | /** * Tự động cập nhật giá khi thay đổi số lượng trên trang sản phẩm WooCommerce * Code by muathemewpgiare02 */ function muathemewpgiare02_update_price_script() { if (is_product()) { ?> <script type="text/javascript"> jQuery(document).ready(function($) { let originalPrice_muathemewpgiare02 = 0; let pricePerUnit_muathemewpgiare02 = 0; let priceUpdated_muathemewpgiare02 = false; function storeOriginalPrice_muathemewpgiare02() { let $priceElement = $('.summary .price .woocommerce-Price-amount').first(); if (!$priceElement.length) return; let priceText = $priceElement.text().replace(/[^0-9.,]/g, ''); pricePerUnit_muathemewpgiare02 = parseFloat(priceText.replace(/,/g, '.')); originalPrice_muathemewpgiare02 = pricePerUnit_muathemewpgiare02; } function updateDisplayPrice_muathemewpgiare02() { let quantity = parseInt($('input.qty').val()) || 1; let totalPrice = pricePerUnit_muathemewpgiare02 * quantity; $('.summary .price .woocommerce-Price-amount').first().text(totalPrice.toFixed(2)); priceUpdated_muathemewpgiare02 = true; } function handleQuantityChanges_muathemewpgiare02() { $('input.qty').on('input', updateDisplayPrice_muathemewpgiare02); $('.plus, .minus').on('click', function() { setTimeout(updateDisplayPrice_muathemewpgiare02, 100); }); } function resetPriceBeforeAddToCart_muathemewpgiare02() { $('form.cart').on('submit', function() { if (priceUpdated_muathemewpgiare02) { $(this).append('<input type="hidden" name="original_price_muathemewpgiare02" value="' + pricePerUnit_muathemewpgiare02 + '">'); } }); } storeOriginalPrice_muathemewpgiare02(); handleQuantityChanges_muathemewpgiare02(); resetPriceBeforeAddToCart_muathemewpgiare02(); }); </script> <?php } } add_action('wp_footer', 'muathemewpgiare02_update_price_script', 99); function muathemewpgiare02_store_original_price($cart_item_data, $product_id) { if (isset($_POST['original_price_muathemewpgiare02'])) { $cart_item_data['original_price_muathemewpgiare02'] = floatval($_POST['original_price_muathemewpgiare02']); } return $cart_item_data; } add_filter('woocommerce_add_cart_item_data', 'muathemewpgiare02_store_original_price', 10, 2); function muathemewpgiare02_apply_original_price($cart_object) { if (is_admin() && !defined('DOING_AJAX')) return; foreach ($cart_object->get_cart() as $cart_item_key => $cart_item) { if (isset($cart_item['original_price_muathemewpgiare02'])) { $product = $cart_item['data']; $original_price = floatval($cart_item['original_price_muathemewpgiare02']); $product->set_price($original_price); } } } add_action('woocommerce_before_calculate_totals', 'muathemewpgiare02_apply_original_price', 10); |
3. Kết Luận
Chỉ cần copy và dán code trên vào functions.php
, xóa cache nếu có. Code này hoạt động trơn tru, giúp hiển thị giá tự động khi thay đổi số lượng sản phẩm. Nếu bạn gặp khó khăn khi cài đặt, hãy liên hệ mình để được hỗ trợ nhanh chóng. Cảm ơn bạn đã theo dõi! Anh em lưu ý, code trên khi 1 class giá của anh em khác thì phải thay sửa lại cho phù hợp để code mới chạy nhé
- Cách Tạo Biểu Mẫu Đăng Ký Đơn Giản Cho Website Cực Dễ 2025
- Hướng Dẫn Tạo Gallery Video Highlight Chuyên Nghiệp Cho WordPress (Chuẩn YouTube, Chuẩn SEO)
- Nên sử dụng tag và category trong bài viết thế nào cho hợp lý?
- Hướng Dẫn Chèn Khung Soạn Thảo Danh Mục Sản Phẩm Flatsome Chuẩn SEO
- Widget là gì? Tất cả 100% kiến thức cần biết về Widget WordPress