How To Add a custom tab in product page Magento2

**john_here** · 07-03-2017, 03:39 AM

How To Add a custom tab in product page Magento2

View more Magento 2 Extension

Name: magento-2-add-custom-tab-l.jpg
Views: 127
Size: 120.3 KB

In this post, i will show you how to Add Custom Tab in Product Page Magento 2

The first, check how to create a simple module at

http://www.venustheme.com/how-to-cre...ento-2-module/

Name: 0.jpg
Views: 129
Size: 47.0 KB

1. Create new attribute in Magento 2 Add Custom Tab to Product Page

Go to this link: admin > Store > Product > Add New Attribute

Name: 1.jpg
Views: 125
Size: 32.0 KB

2. Select a Attribute Sets for the attribute

Go to this link: admin > Store > Attribute Set

You will drag and drop into one of the groups in Group block. For ex: to General ta

Name: 2.jpg
Views: 126
Size: 38.4 KB

3. Update the new attribute for a product

Name: 3.jpg
Views: 127
Size: 49.8 KB

4. Create a layout file

Go to this link: app/code/Ves/HelloWorld/View/frontend/layout/catalog_product_view.xml

PHP Code:


<?xml version="1.0"?>

<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">

    <body>

        <referenceBlock name="product.info.details">

            <block class="Magento\Catalog\Block\Product\View" name="demo.tab" template="Ves_HelloWorld::custom_tab.phtml" group="detailed_info" >

                <arguments>

                    <argument translate="true" name="title" xsi:type="string">Cutom Tab</argument>

                </arguments>

            </block>

        </referenceBlock>

    </body>

</page>

5. Create a template file

Go to this link:

PHP Code:


app/code/Ves/HelloWorld/View/frontend/templates/custom_tab.phtml

<?php // Get current product

$product = $block->getProduct();

?>

<h1 style="color: #ff5501"><?php echo $product->getData('demo'); ?></h1>

Thank you for your attention about this Magento 2 Add Custom Tab to Product Page.
If you have any question about this tutorial, please write your comment at the bottom
page or watch more these below Related. Your comments will be supported
professionally and effectively.

RELATED TUTORIALS & MAGENTO 2

Magento 2 Order Tracking
Magento 2 Visual Design Editor | Magento 2 Page Builder
Magento 2 Contact Form | Custom Form Builder
Magento 2 image Gallery extension
Magento 2 search extension
Magento 2 testimonials
Magento 2 FAQ extension
Magento 2 form builder extension
Magento 2 Blog extension
Magento 2 Mega menu extension

VIEW DETAIL->

View more threads in the same category:

**IToris** · 12-04-2017, 01:03 PM

Nice extension! Thanks for sharing!

You can also try the Product Tabs extension for Magento 2 that will help to add custom tabs or edit existing ones globally or per product.

Features
• Edit tabs globally for all products together
• Edit tabs for each product individually
• Ability to configure different tabs for store views
• Ability to have different tabs for customer groups
• Ability to insert widgets, product sliders, other blocks into tabs
• Ability to reorder tabs globally or on the product level

More information: https://www.itoris.com/magento-2-product-tabs.html

**Mage Lover** · 26-05-2017, 02:21 PM

Thanks for sharing this great and useful tutorial. After applying all the steps, running the commands in the root directory which are:

Code:

 php bin/magento setup:upgrade
    
 php bin/magento cache:clean
    
 php bin/magento cache:clean

Here's another tutorial: Magento 2 custom tab

**Magento Nguyen** · 19-01-2018, 07:41 AM

Also have a look at Magento 2 Product Tabs by Magesolution ! Only $ 59
With this extension admin can add unlimited tabs. The tab can be use static blocks or attributes.
Name: product-tabs-2 (1).jpg
Views: 84
Size: 27.1 KB

Name: product-tabs-2 (1).jpg
Views: 84
Size: 27.1 KB

Features List:
Add tab use attribute
Add tab use static block
Enable "Review" tab
Enable "More Information" tab
Change title of tabs
Change position of tabs
Add unlimited tabs
Support for multi store views
Easy to manage
Easy to use

**wadewilson** · 15-06-2018, 02:29 AM

Product Custom Tabs for Magento 2

Attachment 12573

BSSCommerce Magento 2 Product Custom Tabs extension allows store administrators to manage the content of product page effectively using custom tabs. The primary features of this extension include:

Give additional tab to product page such as reviews, more information,...
Replace default tabs with custom tabs
Build and edit custom tabs with WYSIWYG editor system
Set to enable custom tabs for specific customer groups and purchasing customers only
Use flexible catalog price rule to assign created tabs to any products at ease
Individually manage and edit tabs of each product

This extension is under construction and will go live as soon as possible. You can visit BSSCommerce Magento 2 Product Custom Tabs extension product page to know more information and join the pre-purchase program for 20% discount (Available for 50 First Customers Only!)

**Magezon** · 06-05-2019, 01:38 AM

Hi,
Single Product Page Builder for Magento 2, a user-friendly extension to display product pages in any layout, will help you add a custom tab in Magento 2 product page. You can:
- Add as many tabs as possible.
- Display tabs' bar as vertical or horizontal.
- Easy to customize product tabs: tabs' titles, design options, etc.

Please watch this video tutorial to see how.

View detailed tutorial: https://blog.magezon.com/customize-m...-page-builder/

Magento Expert Forum - Improve your Magento experience

How To Add a custom tab in product page Magento2

Thread Tools

How To Add a custom tab in product page Magento2

View more threads in the same category:

Tags for this Thread

Bookmarks

Bookmarks

Posting Permissions