Woocommerce中的合并描述和附加信息选项卡

I am trying to merge the additional information tab with the description tab in woo commerce.

Basically the intention is to display information from both tabs side by side in possibly a 2 column layout where the first column displays the description and the second column the additional information.

Can this be achieved with a piece of code that can be placed in functions.php.

Thanks

Here is the way to make it (code is well commented):

// Manipulating product tabs
add_filter('woocommerce_product_tabs', 'change_product_tab', 98);
function change_product_tab($tabs){
    global $product;

    // Save the tabs to keep
    $reviews = $tabs['reviews'];

    // Remove tabs
    unset($tabs['description']);
    unset($tabs['additional_information']);
    unset($tabs['reviews']);

    // Add a new tab
    $tabs['other_details'] = array(
        'title'     => __( 'Details', 'woocommerce' ),
        'priority'  => 10,
        'callback'  => 'other_details_tab_content'
    );

    // Set the good priority to existing "reviews" tab
    $reviews['priority'] = 20;

    // Add back "reviews" tab
    $tabs['reviews'] = $reviews;

    return $tabs;
}

// Tab content (two columns)
function other_details_tab_content() {
    global $product;

    $heading = esc_html( apply_filters( 'woocommerce_product_description_heading', __( 'Description', 'woocommerce' ) ) );
    $heading2 = esc_html( apply_filters( 'woocommerce_product_additional_information_heading', __( 'Additional information', 'woocommerce' ) ) );

    ?>
    <!-- Temporary styles (to be removed and inserted in the theme styles.css file) -->
    <style>
        .single-product .half-col{float:left; width:48%;}
        .single-product .half-col.first{margin-right:4%;}
        .single-product .half-col > h3{font-size:1.3em;}
    </style>

    <h2><?php _e("Product details", "woocommerce"); ?></h2>

    <!-- 1. Product description -->

    <div class="half-col first">

    <?php if ( $heading ) : ?>
      <h3><?php echo $heading; ?></h3>
    <?php endif; ?>

    <?php the_content(); ?>

    </div>

    <!-- 2. Product Additional information -->

    <div class="half-col last">

    <?php if ( $heading2 ) : ?>
    <h3><?php echo $heading2; ?></h3>
    <?php endif; ?>

    <?php do_action( 'woocommerce_product_additional_information', $product ); ?>

    </div>
    <?php
}

Code goes in function.php file of your active child theme (or active theme). Tested and works.

enter image description here

Here is another option if you want the data in the tabs to be displayed sequentially instead of in two column format as answered above by LoicTheAztec. Below is the code drawing on the code in LoicTheAztec's answer

// Manipulating product tabs

add_filter('woocommerce_product_tabs', 'change_product_tab', 98);
function change_product_tab($tabs){
global $product;

// Save the tabs to keep
$reviews = $tabs['reviews'];

// Remove tabs
unset($tabs['description']);
unset($tabs['additional_information']);
unset($tabs['reviews']);

// Add a new tab
$tabs['other_details'] = array(
    'title'     => __( 'Details', 'woocommerce' ),
    'priority'  => 10,
    'callback'  => 'other_details_tab_content'
);

// Set the good priority to existing "reviews" tab
$reviews['priority'] = 20;

// Add back "reviews" tab
$tabs['reviews'] = $reviews;

return $tabs;
}

// Tab content
function other_details_tab_content() {
    global $product;

    $heading = esc_html( apply_filters( 'woocommerce_product_description_heading', __( 'Description', 'woocommerce' ) ) );
$heading2 = esc_html( apply_filters( 'woocommerce_product_additional_information_heading', __( 'Additional information', 'woocommerce' ) ) );

?>

<h2><?php _e("Product details", "woocommerce"); ?></h2>
    <?php echo "<br>"; ?>

<!-- 1. Product description -->

<?php if ( $heading ) : ?>
  <h3><?php echo $heading; ?></h3>
<?php endif; ?>

<?php
    the_content();
    echo "<br>";
?>


<!-- 2. Product Additional information -->

<?php if ( $heading2 ) : ?>
<h3><?php echo $heading2; ?></h3>
<?php endif; ?>

<?php do_action( 'woocommerce_product_additional_information', $product ); ?>

<?php
}

You can also refer to the link here: https://docs.woocommerce.com/document/editing-product-data-tabs/