Những code hay dùng trong woocommerce wordpress

Những code hay dùng trong woocommerce wordpress
Những code hay dùng trong woocommerce wordpress

WooCommerce là một plugin miễn phí trên WordPress, được thiết kế đặc biệt để giúp bạn dễ dàng tạo và quản lý cửa hàng trực tuyến. Với WooCommerce, bạn có thể bán hàng hóa vật chất, sản phẩm ảo, dịch vụ và nhiều hơn nữa.

Những code hay dùng trong woocommerce wordpress

Để sử dụng WooCommerce trên WordPress, bạn chỉ cần hoàn thành các bước sau:

  1. Đăng nhập vào Bảng điều khiển WordPress của bạn.
  2. Chọn “Plugins” -> “Thêm mới”.
  3. Tìm kiếm “WooCommerce” trong thanh tìm kiếm và nhấp vào nút “Cài đặt ngay”.
  4. Kích hoạt plugin sau khi đã cài đặt xong.
  5. Hoàn thành hướng dẫn thiết lập ban đầu của WooCommerce để cấu hình cài đặt cơ bản cho cửa hàng của bạn.

Sau khi hoàn tất quá trình này, bạn sẽ có thể thêm sản phẩm, thiết lập các phương thức thanh toán và vận chuyển, quản lý đơn hàng và khách hàng từ Bảng điều khiển WordPress của mình.

Với nhiều tiện ích mở rộng và giao diện tùy chỉnh có sẵn trong thư viện WooCommerce hoặc từ nhà phát triển bên thứ ba, bạn có thể dễ dàng mở rộng tính năng của cửa hàng trực tuyến của mình và tạo ra một trải nghiệm mua sắm độc đáo cho khách hàng.

Những code hay dùng trong woocommerce wordpress

Những code hay dùng trong woocommerce wordpress
Những code hay dùng trong woocommerce wordpress

 

Code để thêm nút “Mua Ngay” cho Woocommerce wordpress – Những code hay dùng trong woocommerce wordpress

Để thêm nút Mua ngay cho Woocommerce vào trang web bằng code, trước hết bạn mở file functions.php trong theme đang sử dụng ra. Sau đó bạn thêm đoạn code dưới đây vào file và lưu lại là xong.

Đọc thêm :   Hướng dẫn hạ cấp phiên bản WordPress

 

/*
* Add quick buy button go to checkout after click

* Author:  uxthemes.net

*/

add_action(‘woocommerce_after_add_to_cart_button’,’devvn_quickbuy_after_addtocart_button’);

function devvn_quickbuy_after_addtocart_button(){

global $product;

?>

<style>

.devvn-quickbuy button.single_add_to_cart_button.loading:after {

display: none;

}

.devvn-quickbuy button.single_add_to_cart_button.button.alt.loading {

color: #fff;

pointer-events: none !important;

}

.devvn-quickbuy button.buy_now_button {

position: relative;

color: rgba(255,255,255,0.05);

}

.devvn-quickbuy button.buy_now_button:after {

animation: spin 500ms infinite linear;

border: 2px solid #fff;

border-radius: 32px;

border-right-color: transparent !important;

border-top-color: transparent !important;

content: “”;

display: block;

height: 16px;

top: 50%;

margin-top: -8px;

left: 50%;

margin-left: -8px;

position: absolute;

width: 16px;

}

</style>

<button type=”button” class=”button buy_now_button”>

<?php _e(‘Mua ngay’, ‘devvn’); ?>

</button>

<input type=”hidden” name=”is_buy_now” class=”is_buy_now” value=”0″ autocomplete=”off”/>

<script>

jQuery(document).ready(function(){

jQuery(‘body’).on(‘click’, ‘.buy_now_button’, function(e){

e.preventDefault();

var thisParent = jQuery(this).parents(‘form.cart’);

if(jQuery(‘.single_add_to_cart_button’, thisParent).hasClass(‘disabled’)) {

jQuery(‘.single_add_to_cart_button’, thisParent).trigger(‘click’);

return false;

}

thisParent.addClass(‘devvn-quickbuy’);

jQuery(‘.is_buy_now’, thisParent).val(‘1’);

jQuery(‘.single_add_to_cart_button’, thisParent).trigger(‘click’);

});

});

</script>

<?php

}

add_filter(‘woocommerce_add_to_cart_redirect’, ‘redirect_to_checkout’);

function redirect_to_checkout($redirect_url) {

if (isset($_REQUEST[‘is_buy_now’]) && $_REQUEST[‘is_buy_now’]) {

$redirect_url = wc_get_checkout_url(); //or wc_get_cart_url()

}

return $redirect_url;

}

Nút Mua ngay có chức năng rất đơn giản nhưng nó lại giúp cải thiện trải nghiệm người dùng khi mua sắm online cực kỳ hiệu quả. Thật thiếu sót nếu bạn không thêm đoạn code cho nút Mua thêm vào trang web của mình
Nút Mua ngay có chức năng rất đơn giản nhưng nó lại giúp cải thiện trải nghiệm người dùng khi mua sắm online cực kỳ hiệu quả. Thật thiếu sót nếu bạn không thêm đoạn code cho nút Mua thêm vào trang web của mình

Chỉ hiển thị Giá thấp nhất của Sản phẩm có biến thể (Show only the lowest price on variable products) – Những code hay dùng trong woocommerce wordpress

Phạm vi giá sản phẩm biến thể thường hiển thị dao động theo khoảng, ví dụ 3.000.000đ – 5.000.000đ.

Với sự trợ giúp của đoạn mã dưới đây, bạn sẽ có thể ẩn giá cao nhất, đồng thời thêm chữ “Giá từ:” vào trước giá tối thiểu. Trong đoạn code, mình giữ nguyên bản tiếng Anh là “From:”, bạn có thể tùy chỉnh nhé.

// Show only lowest prices in WooCommerce variable products
add_filter( ‘woocommerce_variable_sale_price_html’, ‘wpglorify_variation_price_format’, 10, 2 );
add_filter( ‘woocommerce_variable_price_html’, ‘wpglorify_variation_price_format’, 10, 2 );
function wpglorify_variation_price_format( $price, $product ) {
// Main Price
$prices = array( $product->get_variation_price(‘min’, true), $product->get_variation_price(‘max’, true));
$price = $prices[0] !== $prices[1] ? sprintf(__(‘From: %1$s’, ‘woocommerce’), wc_price( $prices[0])):wc_price( $prices[0]);
$prices = array( $product->get_variation_regular_price( ‘min’, true ), $product->get_variation_regular_price( ‘max’, true ) );
sort( $prices );
$saleprice = $prices[0] !== $prices[1] ? sprintf( __( ‘From: %1$s’, ‘woocommerce’ ), wc_price( $prices[0] ) ) : wc_price( $prices[0] );
if ( $price !== $saleprice ) {
$price = ‘<del>’ . $saleprice . $product->get_price_suffix() . ‘</del> <ins>’ . $price . $product->get_price_suffix() . ‘</ins>’;
}
return $price;
}
Những code hay dùng trong woocommerce wordpress
Những code hay dùng trong woocommerce wordpress

Chỉ hiển thị Giá cao nhất của Sản phẩm có biến thể (Show only the highest price on variable products) – Những code hay dùng trong woocommerce wordpress

Nếu vì lý do nào đó bạn muốn hiển thị giá tối đa thay vì giá tối thiểu, hãy sử dụng đoạn mã sau.

Theme Flatsome WordPres
Theme Flatsome WordPres

Ẩn giá đến khi khách hàng chọn 1 biến thể của sản phẩm (Hide Price until user select variations of a product) – Những code hay dùng trong woocommerce wordpress

Thay vì đoạn mã trên, hãy sử dụng đoạn mã bên dưới (đảm bảo không sử dụng cả hai đoạn mã cùng nhau để tránh bất kỳ xung đột nào).

Chúc các bạn chọn được đoạn code mình tìm kiếm và áp dụng thành công nhé share bài Những code hay dùng trong woocommerce wordpress cho anh em bạn bè nhé

Đọc thêm :   cách sử dụng contact form 7 trong wordpress

nếu cần giúp cứ bình luận bên dưới cho mình, Mình sẽ hộ trợ bạn

theo : https://flatsome.xyz/category/thu-thuat

Leave a comment

Email của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *