Vâng hôm nay tôi sẽ chia sẽ cũng như là lưu trữ một số code xử lý liên quan đến coupon woocommerce ở đây để tiện anh em copy nhé
Nếu chúng ta di chuyển form coupon vào trong form checkout page thì form checkout lại chứa form coupon như vậy là html không hợp lệ, chính vì vậy tag
1 |
<form class="checkout_coupon woocommerce-form-coupon" method="post" > |
Sẽ bị tự động remove và như vậy chức năng coupon sẽ không hoạt động, bây giờ chung ta phải xử lý js riêng cho chỗ này để nó hoạt động được
1 2 3 |
<h5 style="font-weight:700;"><?php esc_html_e( 'Apply Promo Code', 'woocommerce' ); ?></h5> <input type="text" name="coupon_code" class="input-text" placeholder="<?php esc_attr_e( 'Enter Your Promo Code', 'woocommerce' ); ?>" id="coupon_code" value="" /> <button id="mr_apply_coupon" type="button" class="button" name="apply_coupon" value="<?php esc_attr_e( 'Apply', 'woocommerce' ); ?>"><?php esc_html_e( 'Apply coupon', 'woocommerce' ); ?></button> |
Chúng ta sẽ sử dụng event click của button mr_apply_coupon để lấy mã coupon và sử dụng ajax để xử lý, code dưới đây được sự dụng trong class
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 |
add_action("wp_head",array($this,'checkout_scripts')); function checkout_scripts() { if(is_checkout()){ ?> <script> jQuery(function($){ $(document).ready(function(e) { $(document).on('click','button#mr_apply_coupon',function(e){ e.preventDefault(); var coupon = $('#coupon_code').val(); if(coupon == ''){ alert('Please input your coupon code!'); $('#coupon_code').focus(); return false; } $(this).html('<i class="fa fa-spinner fa-spin "></i> applying coupon'); var submit_data = { action: 'mr_apply_coupon', coupon: coupon }; console.log(submit_data); $.ajax({ type: 'POST', url: '<?php echo admin_url('admin-ajax.php'); ?>', //url: kitimportelementor_vars.ajax_url, data: submit_data, success: function ( response ) { console.log(response); if (response.success ) { $('button#mr_apply_coupon').html('Apply coupon'); jQuery('body').trigger('update_checkout'); } } }); }); }); }); </script> <?php } } |
1 2 3 4 5 6 7 8 9 10 11 |
function mr_apply_coupon(){ $coupon_code = $_POST['coupon']; if ( WC()->cart->has_discount( $coupon_code ) ){ }else{ $result=WC()->cart->apply_coupon( $coupon_code ); //wc_print_notices(); } wp_send_json_success($result); } add_action("wp_ajax_mr_apply_coupon",array($this,"mr_apply_coupon")); add_action("wp_ajax_nopriv_mr_apply_coupon",array($this,"mr_apply_coupon")); |
Trong woocommerc thì chức năng coupon chỉ được thực hiện tại cart page và checkout page. Đôi lúc khách hàng lại yêu cầu đặt chức năng tại single page. Ngay sau đây là cách làm
Ở đây mình sử dụng event focusout để làm là khi chúng ta rời element input
1 |
<input type="text" id="vaydep_custom_input_coupon" placeholder="Mã giảm giá"> |
Anh chị thấy khá là đơn giản đúng không, còn việc đặt cái input này ở chỗ nào là do anh chị quyết định cho phù hợp với thiết kế
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 |
<script> jQuery(function($){ $(document).ready(function(e) { $(document).on('focusout','input#vaydep_custom_input_coupon',function(e){ var submit_data = { action: 'vaydep_coupon_handle', coupon: $('#vaydep_custom_input_coupon').val() }; console.log(submit_data); $.ajax({ type: 'POST', url: '<?php echo admin_url('admin-ajax.php'); ?>', //url: kitimportelementor_vars.ajax_url, data: submit_data, success: function ( response ) { console.log(response); if (response.success ) { // xử lý gì ở đây là tùy trường hợp } } }); }); }); }); </script> |
Code được sử dụng trong class nhé anh chị
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 |
function vaydep_coupon_handle_ajax(){ global $woocommerce, $product; $response=array(); $coupon_code = $_POST['coupon']; $c = new WC_Coupon($coupon_code); if($c->is_valid($product)){ $response['is_valid'] = "1"; $response['discount_type'] = $c->discount_type; $response['amount']=$c->amount; $response['message']="Áp dụng mã giảm giá thành công!"; }else{ $response['is_valid'] = "0"; $response['amount']=0; $response['message']="Mã giảm giá không hợp lệ!"; } wp_send_json_success($response); } add_action("wp_ajax_vaydep_coupon_handle",array($this,"vaydep_coupon_handle_ajax")); add_action("wp_ajax_nopriv_vaydep_coupon_handle",array($this,"vaydep_coupon_handle_ajax")); |
1 2 3 4 5 6 7 8 |
add_action("init",array($this,"remove_and_add_action")); function remove_and_add_action(){ $emails = WC_Emails::instance(); remove_action("woocommerce_email_customer_details",array($emails,'customer_details'),10,3); remove_action("woocommerce_email_customer_details",array($emails,'email_address'),20,3); add_action("woocommerce_email_customer_details",array($emails,'customer_details'),20,3); add_action("woocommerce_email_customer_details",array($emails,'email_address'),10,3); } |
Hết rồi đó anh chị. Từ khóa tiềm kiếm bài viết này trên google: coupon woocommerce, custom coupon woocommerce
Mọi sự sao chép xin ghi rõ nguồn là fcwordpress.net
Chuyên trang về wordpress: hướng dẫn thiết kế theme, plugin, thủ thuật wordpress