Xóa và thay đổi vị trí tính năng tùy chọn sắp xếp sản phẩm
Xóa và thay đổi vị trí tính năng tùy chọn sắp xếp sản phẩm

Bạn có nhu cầu muốn xoá, đổi tên, thay đổi vị trí của tính năng tùy chọn sắp xếp trong trang sản phẩm của WooCommerce. Bài viết này An Nhiên sẽ hướng dẫn bạn cách để thay đổi tính năng đó.

Xoá các tuỳ chọn sắp xếp

Xóa và thay đổi vị trí tính năng tùy chọn sắp xếp sản phẩm
Xóa và thay đổi vị trí tính năng tùy chọn sắp xếp sản phẩm

Để xoá được các tuỳ chọn sắp xếp, mình sẽ sử dụng đến filter hook của WooCommerce woocommerce_catalog_orderby. Hãy thêm đoạn code bên dưới này vào file functions.php nhé.

add_filter( 'woocommerce_catalog_orderby', 'hk_remove_sorting_options' );
function hk_remove_sorting_options( $options ){
	unset( $options[ 'popularity' ] );
	//unset( $options[ 'menu_order' ] );
	//unset( $options[ 'rating' ] );
	//unset( $options[ 'date' ] );
	//unset( $options[ 'price' ] );
	//unset( $options[ 'price-desc' ] );

	return $options;
}

Đoạn code trên cũng đã khá rõ ràng. Để xoá giá trị theo nhu cầu của bạn, hãy mở comment code bằng cách xoá kí tự //.

  • popularity: Mức độ phổ biến
  • menu_order: Giá trị mặc định
  • rating: Điểm đánh giá
  • date: Mới nhất
  • price: Giá thấp đến cao
  • price-desc: Giá cao xuống thấp

Đổi tên các tuỳ chọn sắp xếp

Ở phần này, mình cũng sử dụng cùng hook của WooCommerce giống với phần trên đó là hook woocommerce_catalog_orderby. Hãy xem đoạn code bên dưới này của mình nhé.

add_filter( 'woocommerce_catalog_orderby', 'hk_rename_sorting_options' );

function hk_rename_sorting_options( $options ){
	$options[ 'price' ] = 'Giá thấp lên cao nè';
	return $options;
}

Tương tự như phần trên, bạn có thể tự thêm các thay đổi cho mình bằng các option popularity, menu_order, rating, date, price, price-desc.

Đây là kết bạn mà mình đạt được sau khi dán đoạn code trên vào file functions.php.

Xóa và thay đổi vị trí tính năng tùy chọn sắp xếp sản phẩm
Xóa và thay đổi vị trí tính năng tùy chọn sắp xếp sản phẩm

Thay đổi thứ tự các tuỳ chọn sắp xếp

Để thay đổi được thứ tự của các tuỳ chọn sắp xếp, việc mình cần làm là phải định nghĩa lại cả biến array của WooCommerce.

add_filter( 'woocommerce_catalog_orderby', 'hk_change_sorting_options_order', 5 );

function hk_change_sorting_options_order( $options ){

	$options = array(
		'menu_order' => __( 'Default sorting', 'woocommerce' ),
		'price'      => __( 'Sort by price: low to high', 'woocommerce' ),
		'date'       => __( 'Sort by latest', 'woocommerce' ),
		'popularity' => __( 'Sort by popularity', 'woocommerce' ),
		'rating'     => __('Sort by average rating', 'woocommerce' ),
		
	);

	return $options;

}

Vì ở trường hợp này, mình đang định nghĩa lại biến của WooCommerce. Nên không chỉ là sắp xếp, bạn có thể xoá hoặc đổi tên các tuỳ chọn ở đây.

Lời kết

Mình hi vọng bài viết trên sẽ phần nào hỗ trợ bạn tốt hơn trong việc thay đổi giao diện website theo nhu cầu của bạn.

Nếu bài viết này hữu ích và giúp tiết kiệm được thời gian của bạn, hãy giúp mình chia sẻ nó. Ngoài ra nếu bạn quan tâm đến các chủ đề tương tự như vậy, hãy đọc các bài viết Thủ thuật WordPress khác và follow Fanpage để không bỏ lỡ bài viết mới từ mình nhé.