Tabs are important to organize content and improve user experience. It avoids information overload and divides large content into easily readable relevant parts. For example, dividing product description, product images & product videos into 3 separate tabs will do much better from both user & search engine’s point of view than stuffing all of them in one tab.
For efficient display of information on a product page, following are the default Magento 2 tabs:
Details: Contains details about the product i.e. description, features, etc.
More Information Tab: Contains product attributes and values
Reviews: Contains customer reviews and add a review section
These product page tabs might not be enough if you want to display more product details in which case you would want to add more product info tabs. In this article, we will see how to add, rename and remove custom tabs from product page.
How to Add Tab to Product Page in Magento 2?
Before adding custom tabs, go through these tabs design guidelines compiled by Nielsen Norman Group.
Suppose you want to add new tab to product page in order to display information about the discounts you are offering on a particular product. To do so, first you need to create a new attribute from Magento admin and add it to default attribute set. Let’s say, you name this attribute Discounts.
Next, create a new template file. You can name it discounts-content.phtml.
Save it in:
app/design/frontend///Magento_Catalog/templates/product/view/
Add the following code.