Cách mở rộng Tab của Woocommerce

Cách mở rộng Tab của Woocommerce
0

Xin chào các bạn,

Mặc định các Tab của Woocommerce gây khó chịu cho người đọc, đặc biệt là phiên bản di động và Google đánh giá không tốt nội dung bên trong:

Để giải quyết vấn đề này chúng ta có 2 cách làm như sau:
Cách 1: Chèn code vào functions.php với nội dung như sau

add_action( 'after_setup_theme','db_stack_product_tabs' );

function db_stack_product_tabs(){ 
    // Remove product tabs
    remove_action('woocommerce_after_single_product_summary','woocommerce_output_product_data_tabs', 10 ); 
    // Get tab content template parts
    add_action('woocommerce_after_single_product_summary','db_get_tab_template_parts', 10 );
}

function db_get_tab_template_parts() {
    // Include required template parts
    ?>
    <div class="woo-description-section"><?php wc_get_template( 'single-product/tabs/description.php' ); ?></div>
    <div class="woo-information-section"><?php wc_get_template( 'single-product/tabs/additional-information.php' ); ?></div>
    <?php comments_template();
}

Cách 2: Dùng plugin có sẵn trên hệ thống WordPress.Org

Với bất kỳ cách làm nào cũng cho ra 1 kết quả:
image

Chúc các bạn thành công :slight_smile:

1 Like

Anh ơi trước khi em làm theo dòng mã code của anh thì phần Giới thiệu sản phẩm của em em đã thêm dòng code để nó thu gọn lại khi người dùng muốn xem thêm về phần giới thiệu thì ấn vào xem thêm thì nó sẽ sổ ra.
Nhưng khi thêm dòng code trên của anh vào thì nó lại xổ ra hết luôn. A có cách nào khắc phục không ạ
Em cảm ơn ạ