Trong một số trường hợp, khi bạn bán hàng cho các đơn vị là doanh nghiệp, họ sẽ yêu cầu bạn xuất hoá đơn VAT.
Vậy làm sao để thu được thông tin yêu cầu xuất hoá đơn của khách hàng khi họ đặt mua hàng online.
Mặc định Wordpress kết hợp Woocommerce chưa có tính năng này, bắt buộc bạn phải code thêm, tuy nhiên bạn không cần lo lắng về việc này.
Bởi vì tại bài viết này, Thịnh sẽ chia sẻ cho bạn đoạn code giúp bạn thêm trường yêu cầu nhập thông tin xuất hoá đơn VAT vào website bán hàng.
Ok bắt đầu ngay nhé!
Lợi ích khi bạn thêm trường yêu cầu nhập thông tin xuất hoá đơn VAT là gì?
Đầu tiên, lợi ích phải kể đến là sự chuyên nghiệp cho website bán hàng của bạn.
Thật tuyệt khi khách hàng có thể chủ động cung cấp thông tin xuất hoá đơn cho bạn ngay trong lúc đặt mua hàng online trên website của bạn.
Kế tiếp, đây là trường yêu cầu nên khách có thể chọn không hay có tuỳ theo nhu cầu thực tế của khách do vậy việc bạn tích hợp công cụ này không hề dư thừa.
Có thì càng tốt và chuyên nghiệp hơn thôi.
Đây là giao diện điền thông tin mua hàng mặc định của Woocommerce khi chưa thêm trường yêu cầu nhập thông tin xuất hoá đơn.

Và đây là giao diện trang điền thông tin mua hàng khi bạn tích hợp trường thu nhập thông tin xuất hoá đơn.

Nhìn đẹp và chuyên nghiệp hơn hẳn đúng không bạn nè.
Khi có đơn hàng, những thông tin yêu cầu này sẽ được gửi riêng đến cho bạn xem như hình dưới đây

Rất cụ thể và chi tiết đúng không nào?
Okay bắt tay vào thực hiện ngay nhé.
Xem thêm những bài viết hướng dẫn khác của Thịnh ở dưới đây:
Hướng Dẫn Tích Hợp Thanh Toán QR Code Ngân Hàng Duyệt Đơn Tự Động Cho Website?
Cách Tạo Popup Quảng Cáo Ảnh/Video Hiển Thị Góc Phải Website Nhanh Chóng
Cách thêm dòng chữ Giá chưa bao gồm VAT vào sau giá trong Woocommerce
Cách thêm trường yêu cầu nhập thông tin xuất hóa đơn VAT vào website bán hàng?
Như Thịnh đã chia sẻ ở phía trên, mặc định Wordpress không có tính năng này nè, bắt buộc phải code thêm.
Đoạn code này được viết bởi a Lê Văn Toản.
Bạn thêm đoạn code trên theo đường dẫn này nha: Giao diện —-> Sửa tệp tin giao diện —-> functions.php —-> Dán đoạn code rùi bấm lưu lại.
Đoạn code thêm trường yêu cầu nhập thông tin xuất hoá đơn VAT vào website bán hàng tại đây
/*
* Thêm lựa chọn xuất hóa đơn VAT vào checkout
* Code đơn giản để hiển thị trường và hiển thị thông tin công ty trong đơn hàng
* */
add_action('woocommerce_after_checkout_billing_form','devvn_xuat_hoa_don_vat');
function devvn_xuat_hoa_don_vat(){
?>
<style>
.devvn_xuat_hoa_don_do {
background: #eee;
padding: 10px;
border-radius: 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
clear: both;
}
.devvn_xuat_vat_wrap {
display: none;
}
label.devvn_xuat_vat_input_label {
display: block;
cursor: pointer;
margin-bottom: 0;
}
.devvn_xuat_vat_wrap fieldset {
margin: 10px 0;
padding: 10px;
background: transparent;
border: 1px solid #b0aeae;
}
.devvn_xuat_vat_wrap fieldset legend {
background: transparent;
padding: 0 5px;
margin: 0 0 0 10px;
font-size: 14px;
display: inline;
width: inherit;
border: 0;
text-transform: none;
color: #000;
}
.devvn_xuat_vat_wrap fieldset p {
margin-bottom: 10px;
}
.devvn_xuat_vat_wrap fieldset p:last-child {
margin-bottom: 0;
}
.vat_active .devvn_xuat_vat_wrap {
display: block;
}
</style>
<div class="devvn_xuat_hoa_don_do">
<label class="devvn_xuat_vat_input_label">
<input class="devvn_xuat_vat_input" type="checkbox" name="devvn_xuat_vat_input" value="1">
Xuất hóa đơn VAT
</label>
<div class="devvn_xuat_vat_wrap">
<fieldset>
<legend>Thông tin xuất hóa đơn:</legend>
<p class="form-row form-row-first" id="billing_vat_company_field">
<label for="billing_vat_company" class="">Tên công ty <abbr class="required" title="bắt buộc">*</abbr></label>
<input type="text" class="input-text " name="billing_vat_company" id="billing_vat_company" placeholder="" value="">
</p>
<p class="form-row form-row-last" id="billing_vat_mst_field">
<label for="billing_vat_mst" class="">Mã số thuế <abbr class="required" title="bắt buộc">*</abbr></label>
<input type="text" class="input-text " name="billing_vat_mst" id="billing_vat_mst" placeholder="" value="">
</p>
<p class="form-row form-row-wide " id="billing_vat_companyaddress_field">
<label for="billing_vat_companyaddress" class="">Địa chỉ <abbr class="required" title="bắt buộc">*</abbr></label>
<span class="woocommerce-input-wrapper"><input type="text" class="input-text " name="billing_vat_companyaddress" id="billing_vat_companyaddress" placeholder="" value=""></span>
</p>
</fieldset>
</div>
</div>
<script type="text/javascript">
(function ($) {
$(document).ready(function () {
function check_vat(){
var parentVAT = $('input.devvn_xuat_vat_input').closest('.devvn_xuat_hoa_don_do');
if($('input.devvn_xuat_vat_input').is(":checked")){
parentVAT.addClass('vat_active');
}else{
parentVAT.removeClass('vat_active');
}
}
check_vat();
$('input.devvn_xuat_vat_input').on('change', function () {
check_vat();
});
});
})(jQuery);
</script>
<?php
}
add_action('woocommerce_checkout_process', 'vat_checkout_field_process');
function vat_checkout_field_process()
{
if (isset($_POST['devvn_xuat_vat_input']) && !empty($_POST['devvn_xuat_vat_input'])) {
if (empty($_POST['billing_vat_company'])) {
wc_add_notice(__('Hãy nhập tên công ty') , 'error');
}
if (empty($_POST['billing_vat_mst'])) {
wc_add_notice(__('Hãy nhập mã số thuế') , 'error');
}
if (empty($_POST['billing_vat_companyaddress'])) {
wc_add_notice(__('Hãy nhập địa chỉ công ty') , 'error');
}
}
}
add_action('woocommerce_checkout_update_order_meta', 'vat_checkout_field_update_order_meta');
function vat_checkout_field_update_order_meta($order_id)
{
$order = wc_get_order($order_id);
if ($order && !is_wp_error($order) && isset($_POST['devvn_xuat_vat_input']) && !empty($_POST['devvn_xuat_vat_input'])) {
$order->update_meta_data('devvn_xuat_vat_input', intval($_POST['devvn_xuat_vat_input']));
if (isset($_POST['billing_vat_company']) && !empty($_POST['billing_vat_company'])) {
$order->update_meta_data('billing_vat_company', sanitize_text_field($_POST['billing_vat_company']));
}
if (isset($_POST['billing_vat_mst']) && !empty($_POST['billing_vat_mst'])) {
$order->update_meta_data('billing_vat_mst', sanitize_text_field($_POST['billing_vat_mst']));
}
if (isset($_POST['billing_vat_companyaddress']) && !empty($_POST['billing_vat_companyaddress'])) {
$order->update_meta_data('billing_vat_companyaddress', sanitize_text_field($_POST['billing_vat_companyaddress']));
}
$order->save();
}
}
add_action( 'woocommerce_admin_order_data_after_shipping_address', 'devvn_after_shipping_address_vat', 99);
function devvn_after_shipping_address_vat($order){
$devvn_xuat_vat_input = $order->get_meta('devvn_xuat_vat_input');
$billing_vat_company = $order->get_meta('billing_vat_company');
$billing_vat_mst = $order->get_meta('billing_vat_mst');
$billing_vat_companyaddress = $order->get_meta('billing_vat_companyaddress');
?>
<p><strong>Xuất hóa đơn:</strong> <?php echo ($devvn_xuat_vat_input) ? 'Có' : 'Không';?></p>
<?php
if($devvn_xuat_vat_input):
?>
<p>
<strong>Thông tin xuất hóa đơn:</strong><br>
Tên công ty: <?php echo $billing_vat_company;?><br>
Mã số thuế: <?php echo $billing_vat_mst;?><br>
Địa chỉ: <?php echo $billing_vat_companyaddress;?><br>
</p>
<?php
endif;
}
Sau khi thêm đoạn code thành công, bạn hãy tiến hành đặt hàng thử trên website xem đã xuất hiện trường điền thông tin VAT chưa nha.
Nếu đã xuất hiện tức là bạn đã add thêm đoạn code thành công và kể từ bây giờ nó sẽ hoạt động trên website của bạn.
Thịnh chúc bạn thành công nha.
Nếu gặp vấn đề gì phát sinh trong quá trình thêm Code hãy inbox cho Thịnh nhé.