In wordpress woocommerce under single product page, i want to change the default tab headings:
Change "Description" to Features and
Change "Additional Information" to "Specifications"
Under which PHP file should i make these changes, for it to take effect ?
Here is how you would rename the tabs (just add to your theme functions.php file) - This is valid for older versions of WooCommerce per their documentation:
add_filter( 'woocommerce_product_tabs', 'woo_rename_tabs', 98 );
function woo_rename_tabs( $tabs ) {
$tabs['description']['title'] = __( 'Features' ); // Rename the description tab
$tabs['additional_information']['title'] = __( 'Specifications' ); // Rename the additional information tab
return $tabs;
}
Related
How to move the product meta to the beginning of the product description tab?
I try:
remove_action( 'woocommerce_single_product_summary', 'woocommerce_template_single_meta', 40 );
add_action( 'woocommerce_product_tabs_description', 'woocommerce_template_single_meta', 10 );
Remove works, but add_action() doesn't.
You can keep the first code line. Then to insert single product meta on product description tab, before description, you can use 2 different ways:
1). Using Hooks as follows:
remove_action( 'woocommerce_single_product_summary', 'woocommerce_template_single_meta', 40 );
add_filter( 'woocommerce_product_tabs', 'woocommerce_custom_product_tabs', 999 );
function woocommerce_custom_product_tabs( $tabs ) {
// We overwrite the callback function with a custom one
$tabs['description']['callback'] = 'woocommerce_product_meta_and_description_tab';
// (optional) We can also overwrite the title
$tabs['description']['title'] = __('Meta and description', 'woocommerce');
return $tabs;
}
function woocommerce_product_meta_and_description_tab() { // this is where you indicate what appears in the description tab
wc_get_template( 'single-product/meta.php' ); // The meta content first
wc_get_template( 'single-product/tabs/description.php' ); // The product description after
}
Code goes in functions.php file of the active child theme (or active theme). Tested and works.
2). Or Overriding templates:
You can override single-product/tabs/description.php template file via your theme as explained in this official documentation.
Once you have copied the file to the woocommerce folder inside your active theme, open edit single-product/tabs/description.php file and add the following line inside it:
wc_get_template( 'single-product/meta.php' );
It will displays the product meta information inside the product description tab.
Don't forget to keep in your active child theme's functions.php file:
remove_action( 'woocommerce_single_product_summary', 'woocommerce_template_single_meta', 40 );
Related: WooCommerce action hooks and overriding templates
There actually is a way to do this within your functions without copying files from woocommerce and overriding them in your child theme.
Per WooCommerce documentation, you can customize the product data tabs. With a small modification to the code they provided, you can do what you're asking:
/**
* Customize product data tabs
*/
add_filter( 'woocommerce_product_tabs', 'woo_custom_description_tab', 98 );
function woo_custom_description_tab( $tabs ) {
$tabs['description']['callback'] = 'woo_custom_description_tab_content'; // Custom description callback
return $tabs;
}
function woo_custom_description_tab_content() { // this is where you indicate what appears in the description tab
wc_get_template( 'single-product/meta.php' ); // add this to add meta to content
the_content(); // keep this in to preserve original functionality
}
I'm trying to use ACF to add a custom attribute to the "Additional Information" tab for the products in WooCommerce. I want the admin to be able to upload a PDF that then should be set and linked in the table found in the "Additional Information" tab.
I've found the default template for the attributes in the plugin directory for WooCommerce, more precisely woocommerce/templates/single-product/product-attributes.php. This is how the template looks. I can easily just put the the_field("pdf") there to display the custom field, but the problem I'm running into is that the Additional Information tab will only show if attributes has been added through WooCommerce.
Is there some way to add additional conditional tags for when to display the Additional Information tab? If I somehow could add if (get_field("pdf")) to that code, I think this would be solved.
Updated: In Woocommerce if any dimensions, weight or product attributes (set to be displayed on product) exist, "Additional Information" tab will be displayed…
So if the tab is hidden and you have added on single-product/product-attributes.php template a custom field get_field("pdf") to be displayed that has a value, you can force "Additional Information" tab to appear using:
add_filter( 'woocommerce_product_tabs', 'woo_customize_tabs', 100, 1 );
function woo_customize_tabs( $tabs ) {
if( ! isset($tabs['additional_information']) && null !== get_field("pdf") ){
$tabs['reviews']['priority'] = 30;
$reviews = $tabs['reviews'];
unset($tabs['reviews']);
$tabs['additional_information'] = array(
'title' => __( 'Additional information', 'woocommerce' ),
'priority' => '20',
'callback' => 'woocommerce_product_additional_information_tab',
);
$tabs['reviews'] = $reviews;
}
return $tabs;
}
Code goes in function.php file of your active child theme (or active theme). Tested and works.
Two things I am trying to do on the product pages of this website: https://lovesometea.com/product/green-coconut/
1) Delete "additional information" tab
2) Add Attribute "Size" above the product description
To delete the "additional information" tab, I have been following this: https://idevie.com/tutorials/how-to-make-woocommerce-product-attributes-more-prominent
So this is what I did:
1) Added a custom plug-in and activated it - http://code.tutsplus.com/tutorials/making-woocommerce-product-attributes-more-prominent--cms-25438
2) Tried removing "additional information" by editing the tabs.php in /wp-content/plugins/woocommerce/templates/single-product/tabs
/**
* Removes the "Additional Information" tab that displays the product attributes.
*
* #param array $tabs WooCommerce tabs to display.
*
* #return array WooCommerce tabs to display, minus "Additional Information".
*/
function tutsplus_remove_product_attributes_tab( $tabs ) {
unset( $tabs['additional_information'] );
return $tabs;
}
add_filter( 'woocommerce_product_tabs', 'tutsplus_remove_product_attributes_tab', 100 );
This is where I'm stuck. I even tried deleting the additional-information.php file all together (in the same tabs folder) and additional information still displays!
I tried putting the above code in three different areas of the tabs.php file but no effect on the tab on the product page.
Any other suggestions? Perhaps there is a different/better method with the latest woocommerce version?
This worked for me for removing the tabs:
Adding this in functions.php:
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;
}
To return the attributes to display under description, I couldn't figure it out so I just added the sizes in the description
Maybe you need to change the priority from 100 to 98 as in woocommerce documentation , put the code in functions.php file
add_filter( 'woocommerce_product_tabs', 'woo_remove_product_tabs', 98 );
function woo_remove_product_tabs( $tabs ) {
unset( $tabs['additional_information'] ); // Remove the additional information tab
return $tabs;
}
I pasted this code in function.php, but it didn't rename the product page tab as it supposed to (http://www.noushasasart.com/product/harsh-bark/)
function woo_remove_product_tabs($tabs) {
unset($tabs['reviews']); // Remove the reviews tab
$tabs['description']['title'] = __('Additional Information'); // Rename the
description tab
return $tabs;
}
how can I solve this?
You have forgotten the filter hook:
add_filter( 'woocommerce_product_tabs', 'woo_customize_tabs', 100, 1 );
function woo_customize_tabs( $tabs ) {
unset($tabs['reviews']); // Remove the reviews tab
$tabs['description']['title'] = __( 'More Information' ); // Rename the description tab
return $tabs;
}
Code goes in function.php file of your active child theme (or theme) or also in any plugin file.
All code is tested on Woocommerce 3+ and works.
Update (related to your comment) | Rename product description heading (inside the tab):
To rename description heading use woocommerce_product_description_heading filter hook this way:
add_filter( 'woocommerce_product_description_heading', 'rename_product_description_heading', 10, 1 );
function rename_product_description_heading( $heading ) {
return __( 'Additional Information', 'woocommerce' );
}
Code goes in function.php file of your active child theme (or theme) or also in any plugin file.
All code is tested on Woocommerce 3+ and works.
Official related documentation: Editing product data tabs
the products in our woocommerce shop don't need any of the default tabs so I have managed to disable them being that I only need to have the product description below the product however, while I want to keep the actual description, I believe the tab itself is redundant since there aren't any other tabs.
Basically, I want to remove the tab's & title altogether but keep the content box below it without modifying the woocommerce core php template file. Is there a way to add a filter to my WordPress theme's functions.php?
function woocommerce_default_product_tabs( $tabs = array() ) {
global $product, $post;
// Description tab - shows product content
if ( $post->post_content ) {
$tabs['description'] = array(
'title' => __( 'Description', 'woocommerce' ),
'priority' => 10,
'callback' => 'woocommerce_product_description_tab'
);
}
While CSS is great, if the stylesheet doesn't load correctly, you could end up showing someone tabs without meaning to. It is best to remove the content before loading (server side), by using a filter, as you had mentioned.
See code below as provided from Woothemes for unsetting data tabs.
EDIT Place within the functions.php file inside your theme.
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;
}
EDIT As noted by #BasvanDijk
To remove altogether, you can use the following
add_filter( 'woocommerce_product_tabs', '__return_empty_array', 98 );
If you want to remove tabs from woo-commerce product details page, then add this code in your function.php
Option 1-
Go to functions.php and Add the following code.
(Go to Admin panel > Appearance > Editor > functions.php)
add_filter( 'woocommerce_product_tabs', 'woo_remove_tabs', 98 );
function woo_remove_tabs( $tabs ){
if(is_product()){
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;
}
By using this filter we can Remove the tabs From the Woocommerce Product Pages.
Option 2-
Or for an alternative approach just add this to your functions.php
remove_action( 'woocommerce_after_single_product_summary', 'woocommerce_output_product_data_tabs', 10);
Option 3-
Hide the tab by adding this to the bottom of woocommerce.css
.woocommerce_tabs .tabs {
display: none;
}
Read more -Woo-commerce: Remove tab from product page
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;
}
function woocommerce_template_product_description() {
woocommerce_get_template( 'single-product/tabs/description.php' );
}
add_action( 'woocommerce_after_single_product_summary', 'woocommerce_template_product_description', 40 );
This work for me with the contributions i got here. Other than removing the tab and also to place back the text.
Credits to Swapnali & Mustafa
Here is the working code:
add_filter( 'woocommerce_product_tabs', 'wcs_woo_remove_reviews_tab', 98 );
function wcs_woo_remove_reviews_tab($tabs) {
unset($tabs['reviews']);
return $tabs;
}
for some reason the code to add to functions.php file did not work for me, even tho it is in the woo commerce codex.
I was getting lots of comment spam to these products that showed reviews.
in the end I manually removed the review tab from all the products using built in wordpress/woocommerce functionality.
go to the product lising page
click the checkbox to select all products (it will only select the products on this page so you may have to go thru several pages to repeat)
from the bulk actions drop down, select edit
click apply
you will now see all the bulk edit actions you can do. Choose the "comments" drop down, and select "Do not allow"
click update
make sure to delete any cache if using a caching plugin
Excuse me but the question is not only removing tabs but also keeping the product description. If you ever tried the code above you would realize that while removing tabs you are actually removing the product description. And this is not the desired case.
You should somewhere add the following code to add it back. But unfortunately this time you can add the description side by side the picture and making a narrow column. I couldn't find the solution to add it nicely below the picture where the tabs existed before.
The code:
function woocommerce_template_product_description() {
woocommerce_get_template( 'single-product/tabs/description.php' );
}
add_action( 'woocommerce_single_product_summary', 'woocommerce_template_product_description', 40 );
Using a combination of the answers above, nesting the function within the action so you can use within a conditional:
add_action( 'wp', 'custom_remove_tabs_by_tag' );
function custom_remove_tabs_by_tag() {
if ( is_product() && has_term( 'tag-term', 'product_tag' ) )
{
// Remove All Product Tabs
remove_action( 'woocommerce_after_single_product_summary', 'woocommerce_output_product_data_tabs', 10 );
// Add Product Description
add_action( 'woocommerce_after_single_product_summary',
function () { woocommerce_get_template( 'single-product/tabs/description.php' );},
40 );
}