向 WooCommerce 单个产品页面添加多个选项卡答案

【问题标题】：Adding multiple tabs to WooCommerce single product pages向 WooCommerce 单个产品页面添加多个选项卡
【发布时间】：2020-09-25 16:49:50
【问题描述】：

我正在尝试向 WooCommerce 添加三个自定义标签。我有下面的代码，其中两个显示了，但由于某种原因，属性描述选项卡没有显示在页面上。不仅数量定价选项卡不显示其描述。我试图将不同的代码部分移动到不同的位置，并检查了代码是否有错误或缺失的部分。这是我能得到的最接近的。

我的过程基本上是删除我不想要的现有标签，然后按照我希望它们出现的顺序添加新标签。

我感觉我错过了什么。

您可以在此处查看该网站：http://demo.bergdahl.com/product/6-oz-catridge/

这是我正在使用的代码：

// WooCommerce Tabs



// REMOVE EXISTING TABS

add_filter( 'woocommerce_product_tabs', 'woo_remove_product_tabs', 98 );


function woo_remove_product_tabs( $tabs ) {

    unset( $tabs['description'] );          // Remove the description tab

    // unset( $tabs['reviews'] );           // Remove the reviews tab

    unset( $tabs['additional_information'] );   // Remove the additional information tab

    return $tabs;
}




// ADD ATTRIBUTE DESCRIPTION TAB

add_filter( 'woocommerce_product_tabs', 'woo_attrib_desc_tab' );

function woo_attrib_desc_tab( $tabs ) {

    // Adds the Attribute Description tab

    $tabs['attrib_desc_tab'] = array(

        'title'     => __( 'Desc', 'woocommerce' ),

        'priority'  => 100,

        'callback'  => 'woo_attrib_desc_tab_content'

    );

    return $tabs;

}


// ADD QUANTITY PRICING TAB

add_filter( 'woocommerce_product_tabs', 'woo_qty_pricing_tab' );

function woo_qty_pricing_tab( $tabs ) {

    // Adds the qty pricing  tab

    $tabs['qty_pricing_tab'] = array(

        'title'     => __( 'Quantity Pricing', 'woocommerce' ),

        'priority'  => 110,

        'callback'  => 'woo_qty_pricing_tab_content'

    );
    return $tabs;
}

// ADD OTHER PRODUCTS TAB

add_filter( 'woocommerce_product_tabs', 'woo_other_products_tab' );

function woo_other_products_tab( $tabs ) {

    // Adds the other products tab

    $tabs['other_products_tab'] = array(

        'title'     => __( 'Other Products', 'woocommerce' ),

        'priority'  => 120,

        'callback'  => 'woo_other_products_tab_content'

    );

    return $tabs;

}

// ADD CUSTOM TAB DESCRIPTIONS

function woo_attrib_desc_tab_content() {

    // The attribute description tab content

    echo '<h2>Description</h2>';

    echo '<p>Custom description tab.</p>';

}

function woo_qty_pricing_tab_content() {

    // The qty pricing tab content

    echo '<h2>Quantity Pricing</h2>';

    echo '<p>Here\'s your quantity pricing tab.</p>';   

}

function woo_other_products_tab_content() {

    // The other products tab content

    echo '<h2>Other Products</h2>';

    echo '<p>Here\'s your other products tab.</p>';

}

根据下面 LoicTheAztec 的回复进行编辑，这是我的整个 functions.php 文件。我在底部有和没有?> 都试过了：

<?php
add_theme_support( 'builder-3.0' );

add_theme_support( 'builder-responsive' );



function register_my_fonts() {

    wp_register_style('googleFonts-OpenSans', '//fonts.googleapis.com/css?family=Open+Sans:400,300,700');

    wp_enqueue_style( 'googleFonts-OpenSans');

}



add_action('wp_enqueue_scripts', 'register_my_fonts');





function sc_replacecolon( $content ){ return str_replace( '[sc:', '[sc name=', $content ); }

add_filter( 'the_content', 'sc_replacecolon', 5 );



/* WOOCOMMERCE */

add_filter( 'woocommerce_product_tabs', 'woo_custom_product_tabs', 100, 1 );
function woo_custom_product_tabs( $tabs ) {

    // 1) Removing tabs

    unset( $tabs['description'] );              // Remove the description tab
    // unset( $tabs['reviews'] );               // Remove the reviews tab
    unset( $tabs['additional_information'] );   // Remove the additional information tab


    // 2 Adding new tabs

    //Attribute Description tab
    $tabs['attrib_desc_tab'] = array(
        'title'     => __( 'Desc', 'woocommerce' ),
        'priority'  => 100,
        'callback'  => 'woo_attrib_desc_tab_content'
    );

    // Adds the qty pricing  tab
    $tabs['qty_pricing_tab'] = array(
        'title'     => __( 'Quantity Pricing', 'woocommerce' ),
        'priority'  => 110,
        'callback'  => 'woo_qty_pricing_tab_content'
    );

    // Adds the other products tab
    $tabs['other_products_tab'] = array(
        'title'     => __( 'Other Products', 'woocommerce' ),
        'priority'  => 120,
        'callback'  => 'woo_other_products_tab_content'
    );

    return $tabs;

}

// New Tab contents

function woo_attrib_desc_tab_content() {
    // The attribute description tab content
    echo '<h2>Description</h2>';
    echo '<p>Custom description tab.</p>';
}
function woo_qty_pricing_tab_content() {
    // The qty pricing tab content
    echo '<h2>Quantity Pricing</h2>';
    echo '<p>Here\'s your quantity pricing tab.</p>';
}
function woo_other_products_tab_content() {
    // The other products tab content
    echo '<h2>Other Products</h2>';
    echo '<p>Here\'s your other products tab.</p>';
}
?>

【问题讨论】：

“它破坏了网站”在 95% 的情况下是语法错误。通过启用WP_DEBUG，您可以获得更有用的错误描述。
我将 Loic 的代码添加到我的 functions.php 的顶部并得到： Parse error: syntax error, unexpected 'add_filter' (T_STRING) in /home/parkymay/public_html/demo/wp-content /themes/BuilderChild-Default/functions.php 在第 1 行
错误表明它在第 1 行，如果我不得不猜测，这表明父主题的 functions.php 存在问题。我使用了你上面的整个functions.php 作为 26 的子主题，它不会产生任何错误。
你能从父 functions.php 中删除所有内容，然后一次添加回 1 个函数吗？
helgatheviking，我想出了一个解决办法。我将代码添加到父主题中的 custom-functions.php 文件中，并在子主题中删除了对它的所有引用。父 functions.php 文件已经调用了自定义文件（如果存在），所以它工作得很好！感谢您的建议，它们确实有助于追踪问题。

标签： php wordpress tabs woocommerce product

【解决方案1】：

由于您使用了 4 次相同的钩子 woocommerce_product_tabs，您的问题来自第一个的最高优先级。相反，您应该只使用一次，将 4 个挂钩函数合并为一个。

这是您经过功能测试的代码，稍作改动：

add_filter( 'woocommerce_product_tabs', 'woo_custom_product_tabs' );
function woo_custom_product_tabs( $tabs ) {

    // 1) Removing tabs

    unset( $tabs['description'] );              // Remove the description tab
    // unset( $tabs['reviews'] );               // Remove the reviews tab
    unset( $tabs['additional_information'] );   // Remove the additional information tab


    // 2 Adding new tabs and set the right order

    //Attribute Description tab
    $tabs['attrib_desc_tab'] = array(
        'title'     => __( 'Desc', 'woocommerce' ),
        'priority'  => 100,
        'callback'  => 'woo_attrib_desc_tab_content'
    );

    // Adds the qty pricing  tab
    $tabs['qty_pricing_tab'] = array(
        'title'     => __( 'Quantity Pricing', 'woocommerce' ),
        'priority'  => 110,
        'callback'  => 'woo_qty_pricing_tab_content'
    );

    // Adds the other products tab
    $tabs['other_products_tab'] = array(
        'title'     => __( 'Other Products', 'woocommerce' ),
        'priority'  => 120,
        'callback'  => 'woo_other_products_tab_content'
    );

    return $tabs;

}

// New Tab contents

function woo_attrib_desc_tab_content() {
    // The attribute description tab content
    echo '<h2>Description</h2>';
    echo '<p>Custom description tab.</p>';
}
function woo_qty_pricing_tab_content() {
    // The qty pricing tab content
    echo '<h2>Quantity Pricing</h2>';
    echo '<p>Here\'s your quantity pricing tab.</p>';
}
function woo_other_products_tab_content() {
    // The other products tab content
    echo '<h2>Other Products</h2>';
    echo '<p>Here\'s your other products tab.</p>';
}

此代码位于您的活动子主题（或主题）的 function.php 文件中或任何插件文件中。

经过测试并且有效。

在同一个钩子中，你可以：

删除标签
添加标签
重新排序标签

相关官方文档：Editing product data tabs

【讨论】：

对此进行了测试，它对我有用（不要认为您需要 100 优先级，但它不会伤害任何东西），因此您的 functions.php 中的其他地方可能存在语法错误。正如我上面建议的那样，您应该启用WP_DEBUG 以找出位置。

【解决方案2】：

我所做的唯一补充是在添加内容之前检查选项卡中是否存在内容。我只是用“if”语句包装了每个新数组。

if (!empty(get_the_content())) {
    $tabs['tab'] = array(
        'title'     => __( 'Tab Title', 'woocommerce' ),
        'priority'  => 100,
        'callback'  => 'woo_tab_content'
    );
}

【讨论】：

【解决方案3】：

function my_simple_custom_product_tab( $tabs ) {

    $tabs['my_custom_tab'] = array(
        'title'    => __( 'Custom Tab', 'textdomain' ),
        'callback' => 'my_simple_custom_tab_content',
        'priority' => 50,
    );

    return $tabs;

}
add_filter( 'woocommerce_product_tabs', 'my_simple_custom_product_tab' );

/**
 * Function that displays output for the shipping tab.
 */
function my_simple_custom_tab_content( $slug, $tab ) {

    ?><h2><?php echo wp_kses_post( $tab['title'] ); ?></h2>
    <p>Tab Content</p><?php

}

【讨论】：