Trong Flatsome phần đánh giá , nhận xét được chia vào các tab theo dạng mặc định , trong bài này thì mục đích là phân tách nguyên cái product tabs (hay gồm mô tả nè, review nè, thông tin bổ sung nè….). Nhiều người không thích nó gom 1 cục như vậy.

Tách Product Tabs thành các section riêng biệt
Thống kê bài viết
Ta chỉ cần , đưa hết đoạn code sau vào file function.php của theme đang dùng nhé
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 |
if ( ! function_exists( 'woocommerce_output_product_data_tabs' ) ) { function woocommerce_output_product_data_tabs() { wc_get_template( 'single-product/tabs/tabs.php' ); } } function woocommerce_output_product_data_tabs() { $product_tabs = apply_filters( 'woocommerce_product_tabs', array() ); if ( empty( $product_tabs ) ) return; echo '<div class="woocommerce-tabs wc-tabs-wrapper">'; foreach ( $product_tabs as $key => $product_tab ) { ?> <div id="tab-<?php echo esc_attr( $key ); ?>"> <?php if ( isset( $product_tab['callback'] ) ) { call_user_func( $product_tab['callback'], $key, $product_tab ); } ?> </div> <?php } echo '</div>'; } |
Giải thích 1 chút về đoạn code nhé
Đầu tiên là filter lại cái hàm woocommerce_output_product_data_tabs để gọi tab
CÓ THỂ BẠN QUAN TÂM
- Code đếm lượt truy cập – không dùng plugin trong wordpress 09/2023
- Làm list category đẹp cho blog trong wordpress 09/2023
- Black Friday 2021 tại TinoHost: Lifetime, giảm đến 99%, tặng 100% thời gian sử dụng 09/2023
- Hướng dẫn Plugin Downgrade hạ phiên bản WordPress xuống phiên bản thấp hơn 09/2023
- Thêm mua hàng nhanh với short code 09/2023
- Cách dùng hình trong Tab trong Flatsome 09/2023
if ( ! function_exists( ‘woocommerce_output_product_data_tabs’ ) ) {
function woocommerce_output_product_data_tabs() {
wc_get_template( ‘single-product/tabs/tabs.php’ );
}
}
Sau đó viết lại function để hiện thị tab ở trên thành list ( dạng trãi ra )
function woocommerce_output_product_data_tabs() {
$product_tabs = apply_filters( ‘woocommerce_product_tabs’, array() );
if ( empty( $product_tabs ) ) return;
echo ‘<div class=”woocommerce-tabs wc-tabs-wrapper”>’;
foreach ( $product_tabs as $key => $product_tab ) {
?>
<div id=”tab-<?php echo esc_attr( $key ); ?>”>
<?php
if ( isset( $product_tab[‘callback’] ) ) {
call_user_func( $product_tab[‘callback’], $key, $product_tab );
}
?>
</div>
<?php
}
echo ‘</div>’;
}
Sau khi đưa đoạn code vào ta có kết qua như sau :

Phần đánh giá và nhận xét được tách ra và trải từ trên xuống nhé
Chúc các bạn thành công nhé
nguồn bài viết : https://thietkewebgiarehcm.com