Home WordpressWordPress cơ bản Thay đổi tiêu đề nút add to cart trong woocommerce

Thay đổi tiêu đề nút add to cart trong woocommerce

by admincp

Bạn đang tự làm web wordpress, làm sao bạn thay đổi được nhãn nút “Add to cart” bên cạnh mỗi sản phẩm. Trong wordpress admin không có tùy chọn đổi tiêu đề của nút này, mà bạn phải thông qua sử dụng code.
Tiêu đề được dịch theo ngôn ngữ bạn thiết lập cho website wordpress.
Thay đổi nhãn nút add to cart

Đây là cách woocommerce tự động thay đổi ngôn ngữ, vì sử dụng wordpress translate tag.

__( 'Add to cart', 'woocommerce' )

Xem cách chuyển ngôn ngữ hiển thị cho wordpress backend & fronted và các plugin hỗ trợ ngôn ngữ chuyển đổi.

Bên cạnh đó, woocommerce cung cấp một vài hooks giúp chúng ta thay đổi tiêu đề nhãn nút add to cart một cách linh hoạt trong mỗi template page.

Thay đổi nút add to cart trong trang sản phẩm chi tiết

Thêm các dòng sau vào file functions.php

add_filter( 'add_to_cart_text', 'woo_custom_cart_button_text' );                                // < 2.1
add_filter( 'woocommerce_product_single_add_to_cart_text', 'woo_custom_cart_button_text' );    // 2.1 +
 
function woo_custom_cart_button_text() {
 
        return __( 'My Button Text', 'woocommerce' );
 
}

Lưu ý: các phiên bản plugin woocommerce khác nhau có thay đổi tên hook, do vậy bạn nên kết hợp code ở nhiều phiên bản tránh mã không xài được cho phiên bản bạn đang sử dụng.

Thay đổi nhãn nút add to cart ở trang product archives

Thiết lập thêm filter woocommerce_product_add_to_cart_text ở bản 2.1 trở lên.

add_filter( 'add_to_cart_text', 'woo_custom_cart_button_text' );                        // < 2.1
add_filter( 'woocommerce_product_add_to_cart_text', 'woo_custom_cart_button_text' );    // 2.1 +
 
function woo_custom_cart_button_text() {
 
        return __( 'My Button Text', 'woocommerce' );
 
}

Tiêu đề nút add to cart cho trang product archives dựa theo product types

Xác định loại sản phẩm, bởi thuộc tính $product->product_type. Thêm đoạn code dưới đây vào theme functions.php và thay đổi tiêu đề nút cho mỗi loại sản phẩm.

<?php
add_filter( 'woocommerce_product_add_to_cart_text' , 'custom_woocommerce_product_add_to_cart_text' );
 
/**
 * custom_woocommerce_template_loop_add_to_cart
*/
function custom_woocommerce_product_add_to_cart_text() {
	global $product;
	
	$product_type = $product->product_type;
	
	switch ( $product_type ) {
		case 'external':
			return __( 'Buy product', 'woocommerce' );
		break;
		case 'grouped':
			return __( 'View products', 'woocommerce' );
		break;
		case 'simple':
			return __( 'Add to cart', 'woocommerce' );
		break;
		case 'variable':
			return __( 'Select options', 'woocommerce' );
		break;
		default:
			return __( 'Read more', 'woocommerce' );
	}
	
}

Đọc tiếp bài tùy biến nút add to cart trong woocommerce phần 2
Good luck.

Để nhận được bài viết mới vui lòng đăng ký kênh kiến thức WordPress từ A-Z ở Form bên dưới. Bạn cũng có thể nhận được sự trợ giúp trên TwitterFacebook

Liên hệ

Công ty chuyên Thiết kế website uy tín nhất Miền Bắc: http://vinastar.net

Hotline tư vấn: 0989 48 3456

Nguồn: Sưu tầm trên internet

You may also like

Leave a Comment