WooCommerce custom tabs give product specifications their own space on a product page, using PHP or a tabs plugin. A small code customization works well for straightforward details, such as a product's size and material. Choose a product tabs plugin when you need reusable content or display rules. Barn2 has a free version for a simple start, plus a more feature-rich option.
The goal is simple: help shoppers find the details that support their purchase. Start with clear product information, then choose how you'll manage it.
Key Takeaways
- Use the
woocommerce_product_tabsfilter to add, remove, or reorder tabs in WooCommerce's classic product layout. - Store specifications separately for each product, and hide the custom tab when its content is empty.
- Choose a plugin for drag-and-drop management, shared tabs, or category-based rules. Your product template still needs to support the tab output.
Add WooCommerce Custom Tabs With PHP
WooCommerce product tabs include Description, Additional Information, and Reviews. Their appearance depends on available content and settings.
Back up your site and test on staging before editing PHP. Add the following snippets to your child theme's functions.php file, inside its existing PHP section, or use a custom plugin. Don't edit the parent theme.
Register the specifications tab
A tab is an array containing a title, priority, and callback function. The callback outputs its content.
This follows WooCommerce's product-tab customization method:
add_filter('woocommerce_product_tabs', 'zdc_add_specifications_tab');
function zdc_add_specifications_tab($tabs) {
global $product;
if (!$product instanceof WC_Product) {
return $tabs;
}
$specs = get_post_meta(
$product->get_id(),
'_zdc_specifications',
true
);
if ('' !== trim((string) $specs)) {
$tabs['zdc_specifications'] = array(
'title' => __('Specifications', 'zdc'),
'priority' => 25,
'callback' => 'zdc_render_specifications',
);
}
return $tabs;
}
function zdc_render_specifications() {
global $product;
echo '<h2>' . esc_html__('Specifications', 'zdc') . '</h2>';
echo '<p>' . esc_html(get_post_meta(
$product->get_id(),
'_zdc_specifications',
true
)) . '</p>';
}
The tab stays hidden until you save specifications using the field below.
Set the order or remove defaults
Default priorities are 10 for Description, 20 for Additional Information, and 30 for Reviews. Lower numbers appear earlier.
Our priority of 25 places Specifications between Additional Information and Reviews. Priority 50 appears after the default tabs, not between them.
To remove Description and Additional Information, add this optional snippet:
add_filter('woocommerce_product_tabs', function($tabs) {
unset($tabs['description']);
unset($tabs['additional_information']);
return $tabs;
}, 99);
Keep those defaults when they contain useful information. Removing a tab hides its storefront output; it doesn't erase the product data.
Give Each Product Its Own Specifications
Shared specifications can save time, but different products often need different details. A product-level field keeps those differences manageable.
Add a field and save its value
Add this alongside the first snippet. It creates a plain-text field in the classic product editor's Product data > General area.
WooCommerce handles its standard product-save security checks before running this save hook. The capability check below also limits editing to authorized users.
add_action('woocommerce_product_options_general_product_data', function() {
woocommerce_wp_text_input(array(
'id' => '_zdc_specifications',
'label' => 'Specifications',
'desc_tip' => true,
'description' => 'Enter specifications as plain text.',
));
});
add_action('woocommerce_process_product_meta', function($product_id) {
if (
!current_user_can('edit_post', $product_id)
|| !isset($_POST['_zdc_specifications'])
) {
return;
}
update_post_meta(
$product_id,
'_zdc_specifications',
sanitize_text_field(
wp_unslash($_POST['_zdc_specifications'])
)
);
});
Open a simple product, enter its actual specifications, and update it. The first snippet retrieves the saved value with get_post_meta() and escapes it before display.
Handle rich content and variations separately
This field supports plain text. It doesn't preserve tables, images, or formatted paragraphs. For those, use an editor-based plugin, or build a wp_editor() field with wp_kses_post() sanitization and output.
Keep structured facts in WooCommerce product attributes when they also support catalog filtering. Copying everything into free-form text makes maintenance harder.
For WooCommerce variable products, this snippet reads the parent product's metadata. It doesn't change specifications when a shopper selects a variation. Variation-specific specifications require separate variation fields and frontend updates.
Use the parent tab for facts that apply across every available option.
Choose a Product Tabs Plugin for Easier Management
Prefer managing content through WordPress? A plugin makes sense when several people update products or the same information appears across your catalog.
These options suit different workloads:
| Tool | Best fit | Cost |
|---|---|---|
| Barn2 WooCommerce Product Tabs | Unlimited tabs with global, category, tag, and per product targeting | Paid license |
| Additional Custom Tabs | A store needing one extra tab | Free version, limited to one custom tab |
| SkyVerge Tab Manager | Shared tabs, per-product overrides, and visual ordering | $99 for one year |
| Addify Custom Product Tabs Manager | Global rules, product overrides, and user-role restrictions | $69 per year |
We recommend choosing by how content is reused, rather than how many settings a plugin offers. Choose Barn2 when shared content needs global, category, tag, or product-specific targeting.
Barn2's product tabs plugin supports unlimited custom tabs, formatted tab content, and shortcodes. Its premium controls let you apply tabs globally, by category or tag, or to individual products, then reorder them.
For a smaller need, Additional Custom Product Tabs is a product tabs plugin with a free version. Its one-tab limit suits a basic specifications section better than a large content library.
SkyVerge Tab Manager adds drag-and-drop ordering and product-specific layouts. Addify adds targeting by user role alongside product, category, and tag rules.
After installation, create a Specifications tab, enter its content, choose its display scope, and save its position. Test one included product and one excluded product before applying rules broadly. Smart Tabs is another option when responsive layouts matter.
Make Tabs Readable on Mobile and Custom Templates
A specifications tab should be easy to open, read, and close. A tidy desktop layout isn't enough if mobile shoppers face cramped labels or sideways scrolling.
Keep headings and mobile layouts practical
Use short titles such as Specifications, Delivery, or Size Guide. Long labels compete for space.
Smart Tabs' responsive layouts can switch to an accordion or full-width presentation on smaller screens. Smart Tabs' accordion lets shoppers expand one section without squeezing every heading into a row.
For classic WooCommerce panels, adjust heading styles with:
.woocommerce-Tabs-panel h2 {
font-size: 1.25rem;
margin-bottom: 0.75rem;
}
That selector targets panel headings, not the clickable tab labels. Preview the result on a narrow screen, especially when specifications include tables.
Match the method to your product template
Elementor, WPBakery, and custom product templates may replace WooCommerce's normal tab output. Adding PHP won't create a missing product-data widget.
TheGem already provides built-in custom product tabs. Open Theme Options > Product, enable Additional tabs, and add tabs through its repeater control. Content can come from TinyMCE or a global section template.
We recommend using the theme's existing controls when they meet your needs. Running two tab systems together creates unnecessary overlap.
For block-based product templates, legacy PHP filters aren't a universal extension method. Keep the product details area in place and use an integration that supports that template.
Fix a Custom Tab That Won't Appear
A missing tab usually points to missing content, a template mismatch, or another customization. Work through those layers in order.
Check the saved value and active template
Our snippet deliberately hides empty specifications. Update the product after entering content, then open its published page.
Confirm the snippet is active in the current child theme or custom plugin. A theme change can leave code behind in an inactive functions.php file.
Next, inspect the Single Product template. Does it include the product-data tabs widget or the appropriate product details area? If the template never renders that section, the registered tab has nowhere to appear.
Also separate normal behavior from a fault. Additional Information depends on visible product attributes or relevant dimensions and weight. Reviews depend on their own settings.
Isolate conflicts and clear stale output
Two customizations can overwrite each other when they use the same tab key. Keep keys unique, such as zdc_specifications.
A plugin running later may also change priorities or remove your entry. Disable competing tab customizations one at a time on staging, then test after each change.
If the tab appears in the page source but won't open, investigate frontend JavaScript or CSS before rewriting the PHP.
Clear product-page caches after changes, including WordPress, host, and CDN layers. Then test in a fresh browser session. Avoid changing several settings together, because you'll lose track of which change worked.
Put Clear Specifications to Work
These tabs work best when they answer a purchase question without creating extra upkeep. Start with accurate content, choose one management method, and test the finished product page on desktop and mobile.
Our WooCommerce hosting checklist helps you prepare the foundation behind those pages. Choose our WordPress or cPanel hosting for your store, with 24/7 support from real people when you need help.
Keep the details clear and the setup manageable, so you can focus on products, customers, and the next sale.
Frequently Asked Questions
Can a custom tab appear on every product?
Yes. Register it without a product-specific condition, or use a plugin's global display setting. Our code requires saved specifications, so products with empty fields won't display the tab.
Can shop owners reorder tabs without editing PHP?
Yes. SkyVerge Tab Manager has a visual drag-and-drop interface. Use the Tab Manager controls to change the order, or adjust each tab's priority in code. Lower numbers come first.
Does adding a specifications tab improve product filtering?
No. A tab organizes information on the product page. Catalog filtering needs structured attributes and a compatible filter interface. Keep reusable facts in attributes, even when a custom tab presents additional buying guidance.
