Here, we will see how to add new custom tab on product view page for full width design layout options in Magento 2.

If you have set the full width options for design layout in your product page settings, then this blog will be useful for you. In case you have set options other than full width in your product page settings, then you can follow our other blog by clicking here.
Please check the below screenshot for more clarification:

Before working on this, we will have to know about Page Layouts. For explain study about page layouts, you can click here.

Page Layouts

The layout of each page in your store consists of distinct sections, or containers, that define the header, footer, and content areas of the page. Depending on the layout, each page might have one, two, three columns, or more. You can think of the layout as the floor plan of the page, and assign a specific layout to be used as the default for CMS, product, and category pages.

Configure default product layouts

1. On the Admin sidebar, go to Stores > Settings > Configuration.
2. In the left panel under General, choose Web.
3. Expand the Default Layouts section.Default Layouts
4. Choose the Default Product Layout that you want to use for product pages.This setting determines the layout that is used by default for product pages.
   • No layout updates – Layout updates are not available for product pages.
   • Empty – Uses a blank layout for product pages.
   • 1 column – Uses a single column layout for product pages.
   • 2 columns with left bar – Uses a two-column layout with the sidebar on the left for product pages.
   • 2 columns with right bar – Uses a two-column layout with the sidebar on the right for product pages.
   • 3 columns – Uses a three-column layout with sidebars on the left and right for product pages.
   When Page Builder is enabled, there are additional full width options available. You can then use the Page Builder content tools to design the layout for your product pages.
   • Page -- Full Width – Uses the Page – Full Width layout for product pages.
   • Category -- Full Width – Uses the Category – Full Width layout for product pages.
   • Product -- Full Width – (Recommended) Uses the Product – Full Width layout for product pages.
5. When complete, click Save Config.

Steps to add custom tab on product page magento 2

• First, create page layout file.
  File Path: app/code/Webkul/Test/view/frontend/page_layout/product-full-width.xml

<?xml version="1.0"?>
<layout xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_layout.xsd">
   <referenceContainer name="product.info.details.after.wrapper.main">
        <block class="Magento\Framework\View\Element\Template" name="product.demotab.wrapper" before="product.attributes.wrapper" template="Magento_PageBuilder::catalog/product/view/section_wrapper.phtml">
            <arguments>
                <argument translate="true" name="title" xsi:type="string">Demo Tab</argument>
                <argument name="section_id" xsi:type="string">demotab</argument>
            </arguments>
            <block class="Magento\Catalog\Block\Product\View" name="demo.tab" template="Webkul_Test::demo_tab.phtml" />
        </block>
    </referenceContainer>
</layout>

• Now, create phtml file.
  File Path: app/code/Webkul/Test/view/frontend/templates/demo_tab.phtml

<?php
    // get current product
    $product = $block->getProduct();
    echo $product->getName();
    // Use product according to your requirement
?>