ĐẶT CÂU HỎI

Tách Product Tabs thành các section riêng biệt

flatsome
29/07/21
0
Tách Product Tabs thành các section riêng biệt

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
Tách Product Tabs thành các section riêng biệt

Tách Product Tabs thành các section riêng biệt

Ta chỉ cần , đưa hết đoạn code sau vào file function.php của theme đang dùng nhé

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

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 :

Tách Product Tabs thành các section riêng biệt
Tách Product Tabs thành các section riêng biệt

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

Điểm 5/5 - ( Có 1 bình chọn)