Tạo tab mới trong trang sản phẩm WooCommerce

Theo mặc định, WooCommerce chỉ hỗ trợ những tab căn bản như mô tả, thông báo thêm, Nhận định.

Vậy ví như bạn có nhu cầu muốn tạo thêm một tab mới thì phải khiến cho như thế nào? Trong bài viết này mình sẽ hướng dẫn bạn khiến cho điều đó.

Tạo tab mới trong trang sản phẩm WooCommerce

Tạo tab mới cho trang sản phẩm

Bạn hãy thêm đoạn code dưới đây vào file functions.php của theme hoặc child theme nhé.

add_filter( 'woocommerce_product_tabs', 'hk_custom_tab' );
function hk_custom_tab( $tabs ) 

	$tabs['hk_custom_tab'] = array(
		'title'    => 'Học WordPress',
		'callback' => 'hk_custom_tab_content',
		'priority' => 50,
	);

	return $tabs;


function hk_custom_tab_content() 
    echo 'Bạn có thể hiển thị thông tin ở đây';

có title là tiêu đề của tab. Và nội dung của tab sẽ được tuỳ chỉnh ở function hk_custom_tab_content.

trị giá priority là độ dành đầu tiên, giả dụ bạn muốn tab mới này được hiển thị ở trước hết, hãy đổi thay 50 thành 5 nhé.

Đây là kết quả mà bạn sẽ đạt được:

Tạo tab mới cho sản phẩm cụ thể

Bạn có thể thêm điều kiện để hiển thị tab cho các sản phẩm nhất thiết.

add_filter( 'woocommerce_product_tabs', 'hk_custom_tab' );
function hk_custom_tab( $tabs ) 

    global $product;

    if ( $product->get_id() == 68 ) 

        $tabs['hk_custom_tab'] = array(
            'title'    => 'Học WordPress',
            'callback' => 'hk_custom_tab_content',
            'priority' => 50,
        );

    

    return $tabs;
	


function hk_custom_tab_content() 
    echo 'Bạn có thể hiển thị thông tin ở đây...';

Bạn mang thể sử dụng thêm biến global $product để lấy được ID của sản phẩm. Trong khoảng đấy dùng hàm if để kiểm tra điều kiện, nếu như thoả nguyện điều kiện của bạn thì tab tuỳ chỉnh mới được hiển thị.

Hãy thay thế ID sản phẩm của mình là 68 thành ID sản phẩm thích hợp có website của bạn nhé.

Lời kết

Mình hi vẳng bài viết trên sẽ giúp bạn thêm được một tab mới trong trang sản phẩm WooCommerce.

nếu như 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 san sớt nó. Ngoài ra nếu bạn quan tâm đến các chủ đề như vậy như vậy, hãy đọc những bài viết chỉ dẫn WooCommerce khác và follow Fanpage để không bỏ lỡ bài viết mới từ mình nhé.

Theo : https://hocwordpress.vn/tao-tab-moi-trong-trang-san-pham-woocommerce

Thủ thuật wordpress : https://flatsome.xyz/category/thu-thuat

Chia sẽ theme Free : https://flatsome.xyz/category/theme

Chia sẽ Plugin miễn phí : https://flatsome.xyz/category/plugin