How To Add a custom tab in product page Magento2

Printable View

07-03-2017, 03:39 AM
john_here

5 Attachment(s)

How To Add a custom tab in product page Magento2

How To Add a custom tab in product page Magento2

View more Magento 2 Extension

Attachment 8439

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/

Attachment 8440

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

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

Attachment 8441

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

Attachment 8442

3. Update the new attribute for a product

Attachment 8443

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>

http://i1379.photobucket.com/albums/...psnrrmdnyn.jpg

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->
12-04-2017, 01:03 PM
IToris

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
26-05-2017, 02:21 PM
Mage Lover

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
19-01-2018, 07:41 AM
Magento Nguyen

1 Attachment(s)

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.
Attachment 11946
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
15-06-2018, 02:29 AM
wadewilson
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!)
06-05-2019, 01:38 AM
Magezon

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.

https://www.youtube.com/watch?v=gjw0quGDmjQ

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