![](/img/trans.png)
[英]Move short description into tabs in Woocommerce single product pages
[英]Adding multiple tabs to WooCommerce single product pages
我正在嘗試向 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>';
}
?>
由於您使用了 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 文件或任何插件文件中。
測試和工作。
在同一個鈎子中,您可以:
相關官方文檔: 編輯產品數據選項卡
我所做的唯一添加是在添加之前檢查選項卡中是否存在內容。 我只是用“if”語句包裝了每個新數組。
if (!empty(get_the_content())) {
$tabs['tab'] = array(
'title' => __( 'Tab Title', 'woocommerce' ),
'priority' => 100,
'callback' => 'woo_tab_content'
);
}
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
}
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.