In a recent Business Bloomer Club Slack thread, a WooCommerce user wanted to automatically add a heading to the “Description” section of product detail pages.
Rather than manually entering a heading for each product, they aimed to apply this globally in the WooCommerce template.
This can be achieved by using the woocommerce_product_description_heading filter, which allows you to customize or add headings to the description section across all products.
I find it unusual that after years of sharing tutorials on Business Bloomer there is no snippet for creating a custom product tab on the single product page!
I mean, we’ve seen an example about Related Products in a Custom Tab snippet a while ago, but here I want to concentrate on the actual functionality of adding a custom tab, giving a name and a heading to it, showing it conditionally (e.g. only for a specific product category), and making sure the “scroll to tab” works when the URL contains its anchor tag.
Enjoy!
Continue reading WooCommerce: Add New Tab @ Single Product Page
The Additional Information tab on the WooCommerce Single Product Page displays information about product dimensions, weight, and possible attribute terms.
There are hooks, thankfully, that can help us display additional content in there, either above or below the attributes table. Enjoy!
Continue reading WooCommerce: Add Content To Additional Information Tab @ Single Product Page
WooCommerce variable products display the list of attributes and their terms in the “Additional Information” tab on the single product page. For example, it will display “Color: red, yellow” and “Size: large, small” if your variable product uses those attribute terms to generate variations.
Yes, you could completely remove the “Additional Information” tab all together, but sometimes you may need to just hide a specific attribute in this table, for whatever reason. Especially when you want to avoid your customers getting confused and abandoning your website.
So, here’s the fix. Enjoy!
Continue reading WooCommerce: Hide Specific “Additional Information” Tab Attribute @ Single Product
If you’re familiar with WooCommerce variable products, variations are generated from product attribute terms (color: yellow & size: large for example). All possible attribute terms are displayed in the “Additional Information” tab of the single product page, so that the customer has an idea of all the possible product options.
However, as you can see from the screenshot below, this information is static i.e. does not change when you select a variation. It would be much more helpful if the attribute information changed from e.g. “Color: red – yellow – green” to the currently selected variation attribute term e.g. “Color: red“.
In today’s quick snippet, we’ll show just that: a combination of PHP and jQuery to make sure that “Additional Information” tab is always updated based on the selected variation. Enjoy!
Continue reading WooCommerce: Dynamically Update Variable Product Attributes @ Single Product
If a WooCommerce product comes with weight and/or height / length / width values, these will be displayed by default in the Single Product page, under the “Additional Information” tab.
Should you need to hide them completely from the frontend while keeping the list of attributes below them, thankfully there’s a PHP one-liner you can use. Enjoy!
Continue reading WooCommerce: Hide Weight & Dimensions From Additional Information Tab @ Single Product
If you like the Amazon single product page layout, you probably dislike the default WooCommerce single product page tabs layout. This is the section where, by default, “Description”, “Reviews”, “Additional Information” and other custom content show… as tabs below the image & short description.
Thankfully, there is a super easy way to remove such tabs and display each tab on top of each other, without hiding any content. If it’s good for your users, then I recommend you make use of this super simple snippet.
In this tutorial, you will learn about “pluggable functions”. Basically, where provided, you can simply redeclare a custom plugin (WooCommerce) function without having to use hooks or overrides. WordPress will just “listen” to your new version and not the original one any longer.
So, enjoy!
Continue reading WooCommerce: “Explode” Product Tabs
While running an eCommerce store makes the operational part of your business a lot smoother, it does not give the facilities, such as asking dozens of questions about the product, seeing it physically, etc. to your customers. This could become a disadvantage if your online shop does not render sufficient information – text and visual – about the products you are selling. So, how will you prevent this situation?
Well, we have a quick and reliable solution.
Adding the relevant and crisp information on the product page, alongside the product, should solve your concern in some cases. However, when there is a lot of detail to be specified, just do not render it all on the page. Using attachments will keep your shop user-friendly and performance-oriented.
To do so, you can install Product Attachment for WooCommerce Plugin on your store.
In this article, we are going to review this WooCommerce plugin bit by bit.
Continue reading WooCommerce: Product Attachment Plugin Review
Depending on your theme, just creating an href link anchor to a product tab might or might not work i.e. it might not scroll to it as it’s currently closed.
Here comes a way to create href links that not only scroll to the tab, but also open it in case it’s closed (this will guarantee the anchor scroll to the tab). Also, a little jQuery “animate” will provide the smooth scroll and enhance UX. Hope you enjoy!
Continue reading WooCommerce: Scroll To Product Tab @ Single Product Page
Product tabs show on the single product page, right below the image gallery. Tab labels are “Description”, “Additional Information”, “Reviews” by default – but what if you wish to rename them into something more relevant to your users?
Here’s a simple PHP snippet you can copy/paste into your child theme’s functions.php file to immediately change the “Description” tab name – enjoy 🙂
Continue reading WooCommerce: Rename Product Description Tab Label @ Single Product Page
When you are on the single product page, and you have a non-empty product long description, a “Description” tab appears below the product images. Unfortunately, not only the tab label is “Description”, but also the tab H2 heading. This sounds and looks horrible, so here’s a way to completely remove it.
Alternatively, you can use this other snippet in order to rename it: https://businessbloomer.com/woocommerce-rename-product-description-single-product-page/ Continue reading WooCommerce: Remove “Description” Heading @ Single Product Tabs
For once, this is a PHP snippet I use on my own website 🙂 In here, I’ll show you how to change the “Description” H2 Heading in the description tab on the single product page. Enjoy! Continue reading WooCommerce: Rename “Description” Title @ Single Product Page Tabs
Today we take a look at the WooCommerce Single Product page and specifically at how to remove the whole Product Tabs Section, and re-add the Long Description on its own (and not inside a tab).
Continue reading WooCommerce: Remove Product Tabs, Show Long Description
This is a simple snippet that will allow you to move the Related Products from below the tabs to inside the single product tabs, in a brand new tab.
Continue reading WooCommerce: Related Products in a Custom Tab @ Single Product PageThere are ways to completely remove the WooCommerce Single Product page tabs, but in case you wish to remove only one of them, these easy snippets will teach you how to do just that.
For example, you may want to hide the “Reviews“ tab because you don’t want to enable product feedback. Or maybe you would like to hide the “Additional Information” tab, because you don’t need that information to be seen.
Either way, it’s super easy – enjoy!
Continue reading WooCommerce: Remove a Tab @ Single Product Page