1, Ẩn tab trong Woocommerce
Để ẩn tab Additional information và các tab khác trong Woocommerce bạn có thể các cách sau
- Dùng css display:none , cách này không triệt để bởi các element vẫn còn xuất hiện, chỉ đánh lừa được những người none-tech
- Sử dụng đoạn code sau
|
1 2 3 4 5 6 7 8 9 10 11 |
/** * Remove product data tabs */ add_filter( 'woocommerce_product_tabs', 'woo_remove_product_tabs', 98 ); function neartech_woocommerce_remove_product_tabs( $tabs ) { unset( $tabs['description'] ); // Remove the description tab, ẩn Mô tả chi tiết unset( $tabs['reviews'] ); // Remove the reviews tab, ẩn Đánh giá unset( $tabs['additional_information'] ); // Remove the additional information tab, ẩn Thông tin bổ sung return $tabs; } |
Muốn ẩn tab nào thì unset tab đó đi, trường hợp không muốn ẩn tab thì bỏ dòng unset đi.
2, Đổi tên tab
Ở trên là ví dụ về cách ẩn tab đi, trong trường hợp bạn muốn đổi tên tab thì làm như thế nào, đừng lo lắng, bạn hãy sử dụng đoạn code sau
|
1 2 3 4 5 6 7 8 9 10 11 12 |
/** * Rename product data tabs */ add_filter( 'woocommerce_product_tabs', 'neartech_woocommerce_rename_tabs', 98 ); function neartech_woocommerce_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; } |
Ở ví dụ trên, mình đã rename cả 3 tab, trong trường hợp bạn muốn chỉ rename 1 tab nào đó thì bạn để lại dòng đó và xoá các dòng còn lại đi
3, Thêm một tab mới
Tất nhiên rồi, ở trên mình đã hướng dẫn các bạn cách ẩn, đổi tên các tab, vậy để thêm một tab mới thì làm như thế nào. Bạn có thể sử dụng đoạn code sau
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 |
/** * Add a custom product data tab */ add_filter( 'woocommerce_product_tabs', 'neartech_woocommerce_new_product_tab' ); function neartech_woocommerce_new_product_tab( $tabs ) { // Adds the new tab $tabs['test_tab'] = [ 'title' => __( 'New Product Tab', 'woocommerce' ), 'priority' => 50, 'callback' => 'neartech_woo_new_product_tab_content' ]; return $tabs; } function neartech_woo_new_product_tab_content() { // The new tab content echo '<h2>New Product Tab</h2>'; echo '<p>Here\'s your new product tab.</p>';//code tùy biến } |
4, Thay đổi thứ tự các tab
Để thay đổi thứ tự các tab trong single product Woocommerce, bạn dùng đoạn code sau:
|
1 2 3 4 5 6 7 8 9 10 11 |
/** * Reorder product data tabs */ add_filter( 'woocommerce_product_tabs', 'neartech_woocommerce_reorder_tabs', 98 ); function neartech_woocommerce_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; } |
Neartech xin trân trọng cảm ơn bạn đã quan tâm bài viết này! Nếu bạn gặp khó khăn gì hãy để lại comment ở bên dưới, nếu có thể mình sẽ giúp đỡ bạn!
