Custom Product Tabs trong Woocommerce

19/04/2019 Việt Hải Thủ Thuật Wordpress 2295 view

Xin chào các bạn Woocommerce là một trong những plugin quan trọng mà hầu như dev WordPress nào cũng cần tới, vì vậy khiến cho cấu trúc website có Woocommerce hầu như rất đơn giản vậy chúng ta hãy thay đổi chúng. Trong bài này mình sẽ chỉnh sửa Product Tabs trang chi tiết sản phẩm.

Chèn code vào file functions.php để sử dụng nhé

Thêm một tab tùy chỉnh

// Add a custom product data tab
add_filter( 'woocommerce_product_tabs', 'woo_new_product_tab' );
function woo_new_product_tab( $tabs ) {
     
    // Adds the new tab
     
    $tabs['test_tab'] = array(
        'title'     => __( 'New Product Tab', 'woocommerce' ),
        'priority'  => 50,
        'callback'  => 'woo_new_product_tab_content'
    );
 
    return $tabs;
 
}
function woo_new_product_tab_content() {
 
    // The new tab content
 
    echo '<h2>New Product Tab</h2>';
    echo '<p>Here\'s your new product tab.</p>';
     
}

Xóa các tabs

// Remove product data tabs
add_filter( 'woocommerce_product_tabs', 'woo_remove_product_tabs', 98 );
 
function woo_remove_product_tabs( $tabs ) {
 
    unset( $tabs['description'] );          // Remove the description tab
    unset( $tabs['reviews'] );          // Remove the reviews tab
    unset( $tabs['additional_information'] );   // Remove the additional information tab
 
    return $tabs;
}

Đổi tên tabs

// Rename product data tabs
add_filter( 'woocommerce_product_tabs', 'woo_rename_tabs', 98 );
function woo_rename_tabs( $tabs ) {
 
    $tabs['description']['title'] = __( 'More Information' );       // Rename the description tab
    $tabs['reviews']['title'] = __( 'Ratings' );                // Rename the reviews tab
    $tabs['additional_information']['title'] = __( 'Product Data' );    // Rename the additional information tab
 
    return $tabs;
 
}

Tùy chỉnh một tab

// Customize product data tabs
add_filter( 'woocommerce_product_tabs', 'woo_custom_description_tab', 98 );
function woo_custom_description_tab( $tabs ) {
 
    $tabs['description']['callback'] = 'woo_custom_description_tab_content';    // Custom description callback
 
    return $tabs;
}
 
function woo_custom_description_tab_content() {
    echo '<h2>Custom Description</h2>';
    echo '<p>Here\'s a custom description</p>';
}

Sắp xếp lại các tabs

// Reorder product data tabs
add_filter( 'woocommerce_product_tabs', 'woo_reorder_tabs', 98 );
function woo_reorder_tabs( $tabs ) {
 
    $tabs['reviews']['priority'] = 5;           // Reviews first
    $tabs['description']['priority'] = 10;          // Description second
    $tabs['additional_information']['priority'] = 15;   // Additional information third
 
    return $tabs;
}

Đổi tên tabs thông tin bổ sung

// Rename the additional information tabs
add_filter( 'woocommerce_product_tabs', 'woo_rename_tabs', 98 );
 
function woo_rename_tabs( $tabs ) {
 
    global $product;
     
    if( $product->has_attributes() || $product->has_dimensions() || $product->has_weight() ) { // Check if product has attributes, dimensions or weight
        $tabs['additional_information']['title'] = __( 'Product Data' );    
    }
  
    return $tabs;
  
}