Hoàng Web

Thiết Kế Website WordPress

  • Kho giao diện
  • Dịch Vụ
    • Thiết kế web giá rẻ
    • Thiết kế website WordPress
    • Hosting Miễn Phí 100GB
    • Tích hợp thanh toán MoMo, ViettelPay, Vietcombank, MB..
    • Tối ưu Google PageSpeed
    • Sửa lỗi nâng cấp website
    • Viết plugin WordPress
    • Code Tool theo yêu cầu
  • Bảng giá
  • Quy trình làm việc
  • Giới thiệu
  • Liên Lạc
Trang chủ » Wordpress » Danh sách Hooks tùy chỉnh WooCommerce

Danh sách Hooks tùy chỉnh WooCommerce

Thứ Hai, 05/11/2018 by Hoàng Quách

Nội dung

  • 1 Chuyển hướng khi thêm sản phẩm vào giỏ hàng
  • 2 Xóa trường địa chỉ tại trang thanh toán
  • 3 Thay đổi số lượng sản phẩm hiển thị trên trang
  • 4 Hiển thị thông điệp phía trên form đăng ký/đăng nhập
  • 5 Xóa bỏ breadcrumbs
  • 6 Chuyển đến trang thanh toán khi thêm sản phẩm vào giỏ hàng
  • 7 Thay thế “out of stock”
  • 8 Giới hạn giao hàng đến các quốc gia được chọn
  • 9 Hiển thị “sản phẩm đã có trong giỏ hàng” thay vì nút “thêm vào giỏ hàng”
  • 10 Thay thế phân trang mặc định cho WooCommerce
  • shares
  • Facebook
  • Facebook Messenger
  • Gmail
  • Viber
  • Skype

Từ hơn 5 năm qua, WooCommerce được công nhận là plugin thương mại điện tử mạnh mẽ và dễ sử dụng nhất cho WordPress. Trong bài viết này, mình có biên soạn tất cả các đoạn mã để có thể tùy chỉnh WooCommerce với tính năng được mở rộng.

Updated: Xem đầy đủ hướng dẫn tùy biến WooCommerce để xây dựng web bán hàng hiệu quả.

Chuyển hướng khi thêm sản phẩm vào giỏ hàng

Đôi khi bạn cho phép người dùng thêm sản phẩm vào giỏ hàng chỉ bằng cách nhấp vào một liên kết nào đó. Thật dễ dàng để thực hiện, chỉ cần thêm tham số ?add-to-cart=974 ở cuối bất kỳ liên kết nào.

Trong ví dụ này, 974 là id sản phẩm và phải được thay thế bằng id của sản phẩm bạn muốn thêm vào giỏ hàng.

http://yoursite.com/checkout/?add-to-cart=974

Xóa trường địa chỉ tại trang thanh toán

Nếu bạn đang bán sản phẩm kỹ thuật số, bạn không nhất thiết phải hỏi địa chỉ của người mua. Để loại bỏ các trường địa chỉ khỏi thanh toán, hãy chèn đoạn mã sau vào tệp functions.php trong giao diện WordPress của bạn:

add_filter( 'woocommerce_checkout_fields' , 'custom_override_checkout_fields' );
 
function custom_override_checkout_fields( $fields ) {
    unset($fields['billing']['billing_first_name']);
    unset($fields['billing']['billing_last_name']);
    unset($fields['billing']['billing_company']);
    unset($fields['billing']['billing_address_1']);
    unset($fields['billing']['billing_address_2']);
    unset($fields['billing']['billing_city']);
    unset($fields['billing']['billing_postcode']);
    unset($fields['billing']['billing_country']);
    unset($fields['billing']['billing_state']);
    unset($fields['billing']['billing_phone']);
    unset($fields['order']['order_comments']);
    unset($fields['billing']['billing_address_2']);
    unset($fields['billing']['billing_postcode']);
    unset($fields['billing']['billing_company']);
    unset($fields['billing']['billing_last_name']);
    unset($fields['billing']['billing_city']);
    return $fields;
}

Thay đổi số lượng sản phẩm hiển thị trên trang

Một cách đơn giản nhưng hiệu quả để xác định số lượng sản phẩm sẽ được hiển thị trên mỗi trang. Trong ví dụ này, 25 sản phẩm sẽ được hiển thị, cập nhật giá trị này với số lượng sản phẩm mong muốn và thêm dòng này vào tệp functions.php.

add_filter( 'loop_shop_per_page', create_function( '$cols', 'return 25;' ), 20 );

Hiển thị thông điệp phía trên form đăng ký/đăng nhập

Dưới đây là một cách đơn giản để tự động thêm thông báo tùy chỉnh phía trên biểu mẫu đăng nhập / đăng ký. Mã này sẽ được chèn vào tệp functions.php của bạn.

add_action( 'woocommerce_before_customer_login_form', 'jk_login_message' );
function jk_login_message() {
    if ( get_option( 'woocommerce_enable_myaccount_registration' ) == 'yes' ) {
	?>
		<div class="woocommerce-info">
			<p><?php _e( 'Returning customers login. New users register for next time so you can:' ); ?></p>
			<ul>
				<li><?php _e( 'View your order history' ); ?></li>
				<li><?php _e( 'Check on your orders' ); ?></li>
				<li><?php _e( 'Edit your addresses' ); ?></li>
				<li><?php _e( 'Change your password' ); ?></li>
			</ul>
		</div>
	<?php
	}
}

Xem thêm hướng dẫn:

  • sửa số lượng sản phẩm trên một hàng với woocommerce.
  • Thay đổi số lượng hiển thị sản phẩm liên quan trong woocommerce

Xóa bỏ breadcrumbs

Nếu bạn nghĩ breadcrumbs là không cần thiết với trang web WordPress của bạn, bạn có thể loại bỏ nó một cách dễ dàng với đoạn mã sau.

add_action( 'init', 'jk_remove_wc_breadcrumbs' );

function jk_remove_wc_breadcrumbs() {
    remove_action( 'woocommerce_before_main_content', 'woocommerce_breadcrumb', 20, 0 );
}

Xem thêm:

  • Thay đổi hiển thị breadcrumbs của woocommerce wordpress theme

Chuyển đến trang thanh toán khi thêm sản phẩm vào giỏ hàng

Một điều thú vị cho phép bạn tự động chuyển hướng đến trang thanh toán khi sản phẩm đã được thêm vào giỏ hàng. Như nhiều tùy biến khác từ bài viết này, mã này sẽ được thêm vào tệp functions.php

function add_to_cart_checkout_redirect() {
    wp_safe_redirect( get_permalink( get_option( 'woocommerce_checkout_page_id' ) ) );
    die();
}

add_action( 'woocommerce_add_to_cart', 'add_to_cart_checkout_redirect', 16 );

Thay thế “out of stock”

Nếu bạn đang bán mặt hàng độc đáo, sẽ có ý nghĩa hơn khi hiển thị “đã bán” thay vì nhãn “hết hàng” bởi mặc định. Để làm như vậy, bạn chỉ cần dán mã này vào tệp functions.php là xong.

add_filter('woocommerce_get_availability', 'availability_filter_func');

function availability_filter_func($availability) {
	$availability['availability'] = str_ireplace('Out of stock', 'Sold', $availability['availability']);
	return $availability;
}

Giới hạn giao hàng đến các quốc gia được chọn

Nếu bạn chỉ sẵn sàng giao hàng cho các quốc gia cụ thể, bạn có thể sử dụng mã bên dưới để thực hiện việc đó. Các quốc gia có thể được thêm vào mảng PHP.

function woo_override_checkout_fields( $fields ) { 

	$fields['shipping']['shipping_country'] = array(
		'type'      => 'select',
		'label'     => __('My New Country List', 'woocommerce'),
		'options' 	=> array('AU' => 'Australia')
	);

	return $fields; 
} 
add_filter( 'woocommerce_checkout_fields' , 'woo_override_checkout_fields' );

Hiển thị “sản phẩm đã có trong giỏ hàng” thay vì nút “thêm vào giỏ hàng”

Nếu khách truy cập đã thêm sản phẩm nào đó vào giỏ hàng của mình, có thể là một thông báo tuyệt vời để cho họ biết sản phẩm này đã có trong giỏ hàng. Ý tưởng bạn sẽ đổi nhãn nút Add to cart. Đây là một đoạn mã đơn giản để làm điều đó. Chỉ cần thêm nó vào tệp functions.php của bạn.

add_filter( 'woocommerce_product_single_add_to_cart_text', 'woo_custom_cart_button_text' );
function woo_custom_cart_button_text() {
	global $woocommerce;
	foreach($woocommerce->cart->get_cart() as $cart_item_key => $values ) {
		$_product = $values['data'];
 
		if( get_the_ID() == $_product->id ) {
			return __('Already in cart - Add Again?', 'woocommerce');
		}
	}
	return __('Add to cart', 'woocommerce');
}
 
add_filter( 'add_to_cart_text', 'woo_archive_custom_cart_button_text' );
function woo_archive_custom_cart_button_text() {
	global $woocommerce;
	foreach($woocommerce->cart->get_cart() as $cart_item_key => $values ) {
		$_product = $values['data'];
		if( get_the_ID() == $_product->id ) {
			return __('Already in cart', 'woocommerce');
		}
	}
	return __('Add to cart', 'woocommerce');
}

Thay thế phân trang mặc định cho WooCommerce

Cũng như WordPress, WooCommerce không sử dụng phân trang theo mặc định. Điều này có thể được thay đổi dễ dàng trên WordPress với plugin WP PageNavi. Khi sử dụng WooCommerce, nó đòi hỏi một chút kỹ năng sử dụng hooks để bạn thực hiện điều này.

Điều đầu tiên cần làm là cài đặt plugin WP PageNavi. Sau khi hoàn tất, chỉ cần mở tệp functions.php của bạn và dán mã sau.

remove_action('woocommerce_pagination', 'woocommerce_pagination', 10);
function woocommerce_pagination() {
		wp_pagenavi(); 		
	}
add_action( 'woocommerce_pagination', 'woocommerce_pagination', 10);

Trên đây là các mã tùy chỉnh WooCommerce hay sử dụng, nếu bạn có thêm những tính năng tùy biến nào hay xin chia sẻ bình luận dưới bài viết này nhé.

Hãy cho mình biết suy nghĩ của bạn trong phần bình luận bên dưới bài viết này. Hãy theo dõi kênh chia sẻ kiến thức WordPress của Hoangweb trên Twitter và Facebook

  • shares
  • Facebook
  • Facebook Messenger
  • Gmail
  • Viber
  • Skype

Chuyên mục: Wordpress Tìm kiếm: Woocommerce

Comments

  1. Phương says

    Thứ Ba, 12/03/2019 at 11:24 chiều

    Hi!
    Bạn có thể giúp mình cách làm email subject thành: Mã đơn hàng – Title product URL không?
    Theo mẫu thid get được mã đơn hàng nhưng mình ko lấy dc title vào
    Thanks

    • Hoàng Quách says

      Thứ Năm, 14/03/2019 at 3:14 chiều

      bạn xem ví dụ này nhé:

      add_filter('woocommerce_email_subject_new_order', 'change_admin_email_subject', 1, 2);
      function change_admin_email_subject( $subject, $order ) {
      	global $woocommerce; 
      	$blogname = wp_specialchars_decode(get_option('blogname'), ENT_QUOTES);
      	$subject = sprintf( '[%s] New Customer Order (# %s) from Name %s %s', $blogname, $order->id, $order->billing_first_name, $order->billing_last_name );
      	return $subject; 
      }
      
  2. Phương says

    Thứ Năm, 04/04/2019 at 9:48 sáng

    Hi!
    Cảm ơn Hoàng đã quan tâm đến câu hỏi của mình nhé.
    Mình vừa add vào function đoạn code của bạn nhưng kết quả như này:
    New Customer Order (# 6769) from Name Nguyen

    Ý mình muốn ví dụ sản phẩm tên là A
    Thì khi khách đặt hàng trong email sẽ báo l�
    #order number – A

    • Hoàng Quách says

      Thứ Sáu, 05/04/2019 at 12:16 chiều

      Mã lấy #order number là $order->get_id() .
      Đơn hàng có thể có nhiều items (sản phẩm), để lấy danh sách các sản phẩm có trong đơn hàng bạn sử dụng API sau:

      foreach( $order->get_items() as $item_id => $item ){
          //Get the product ID
          $product_id = $item->get_product_id();
      
          //Get the WC_Product object
          $product = $item->get_product();
      
          // The quantity
          $product_name = $item->get_quantity();
      
          // The product name
          $product_name = $item->get_name(); // … OR: $product->get_name();
      
          //Get the product SKU (using WC_Product method)
          $sku = $product->get_sku();
      }
      

      CHúc bạn thành công!

  3. Cao Trung Kiên says

    Thứ Tư, 05/06/2019 at 1:44 chiều

    Sửa các chữ này ở trang giỏ hàng bằng cách nào vậy bạn

    SHOPPING CART CHECKOUT DETAILS ORDER COMPLETE

    Xin cám ơn

    • Hoàng Quách says

      Thứ Năm, 06/06/2019 at 9:33 chiều

      Xem cách việt hóa woocommerce, chi tiết: https://docs.woocommerce.com/document/woocommerce-localization/

Tôi giúp gì cho bạn?

HOÀNG WEB

Địa chỉ: Tây Sơn, Phường Quang Trung, Quận Đống Đa, Hà Nội

Hotline: 0987 342 124 – 0868 292 303 (8h:00 – 21h:00)

Email: [email protected]

Website: www.hoangweb.com

KẾT NỐI VỚI TÔI

  • Facebook
  • GitHub
  • YouTube

SẢN PHẨM

  • Plugin Thanh Toán Quét Mã QR Code Tự Động
  • WP2Speed – Tối ưu Google Speed
  • 23WebHost – Hosting Miễn Phí 100GB

LIÊN KẾT

  • Có nên thuê thiết kế website giá rẻ?
  • Hướng dẫn thanh toán
  • Chính sách hoàn tiền
  • Trung tâm hỗ trợ

Copyright © 2023 | All rights reserved | HOANG WEB
Mọi hình thức sao chép nội dung trên website này mà chưa được sự đồng ý đều là trái phép.