Thêm các tab tùy chỉnh trong trang chi tiết sản phẩm WooCommerce

Trong hướng dẫn này, tôi sẽ chỉ cho bạn cách bạn sẽ thêm các tab tùy chỉnh với nội dung trên trang chi tiết sản phẩm WooCommerce. Theo mặc định, có hai tab: Mô tả & Đánh giá. Tôi muốn thêm nhiều tab ở đó.

Đây là các đoạn mã PHP nhỏ cho nó.

/**
* Displaying custom tab(s) on WooCommerce Product details page
*
* @author Paul
* @license GPL2.0+
* @copyright 2018
*/
function paul_cutsom_tabs( $arr ) {
$tabs = array(
'my_tab_1' => array(
'callback' => 'callback_for_tab',
'title' => __( 'My Tab 1', 'themeprefix' )
),
'my_tab_2' => array(
'callback' => 'callback_for_tab',
'title' => __( 'My Tab 2', 'themeprefix' )
),
);
return array_merge( $arr, $tabs );
}
add_filter('woocommerce_product_tabs', 'paul_cutsom_tabs', 99 );
function callback_for_tab( $key, $tab ) {
if( 'my_tab_1' === $key )
echo '<p>My content for Tab 1</p>';
if( 'my_tab_2' === $key )
echo '<p>My content for Tab 2</p>';
}

Plugin WooCommerce có bộ lọc woocommerce_product_tabs . Vì vậy, bạn có thể dễ dàng thêm các tab tùy chỉnh mà không cần sửa đổi plugin cốt lõi.

Nó sẽ rất hữu ích khi bạn sẽ hiển thị bất kỳ dữ liệu tùy chỉnh nào với sự trợ giúp của một số trường tùy chỉnh của plugin (như ACF, Pods, CMB2).