Magento 2 Custom Tabs

Configuration

• Go to Admin > Stores > Configuration > Vdcstore > Customtabs

• General Configuration

• Module Enable: Select Yes to enable this extension.

• Hide Default Tabs: Select No if you want to keep the default tabs visible, or select Yes if you want to hide the default tabs.

• Enable Product Recommendation Blocks: Select whether to enable or disable the default related and up-sell products on the product page.

• Go to catalog > products > Edit product.

• Users can edit the particular product and also add various conditions such as activity, material, color, style, features in the particular product.

• Catalog > Product Tabs > Product Tabs Management

• Where you will find a grid displaying all product tabs, including default tabs such as Details, More Information, and Reviews. The grid provides details like Tab ID, Title, Status, Position, and Edit link.

• Explore the Action field to select options such as Enable, Disable, or Delete for the chosen tabs.

• Add New Tab: Click this button to create a new tab. You will be redirected to the tab editing page.

• Reindex Rule: Since module enables assigning tabs to products based on rules, you must click this button to remove the tab from a product when it no longer matches the rule.

• This grid is store view-enabled, allowing you to take actions and edit custom tabs within a specific store view scope. The module supports bulk actions, including deleting, enabling, and disabling multiple product tabs directly from the grid.

• Steps to follow:
  • Select product tabs by checking the box in the first column.

• If you select the Disabled option, a pop-up will appear.

• Create and Edit Product Tabs
  
  • To create a new tab, click the Add New Tab button.
  • To edit an existing tab, click the Edit link for that tab in the product tabs grid.
  • This will open the Edit Tab page, where you can begin designing the tab.
• Note: When you edit a tab in All Store Views, any duplicated tabs across all store views will also be updated. However, if you edit a duplicate tab in a specific store view, the original tab in the All Store Views grid and other store views will remain unchanged.

• Tab Configuration Options:
  
  • Select Yes to enable the tab or No to disable it.
  
  
  • Title: Enter the title for the tab.
  • Content: Edit the content to be displayed on the tab. Use the WYSIWYG editor to add widgets, variables, and more.
  • Customer Groups: Select multiple customer groups that will have access to view the tab.
  • Position: Enter a number to set the tab’s sort order. Tabs with smaller numbers will appear first.
  
  
  • In addition to the content and general settings above, you can enhance the tab by adding product recommendation blocks and product attributes as needed.

• Related, Up-sell, Cross-sell, and Assign Products:
  
  • Show Related Products: Select Yes to add the Related Products block to the tab, or No to exclude it.
  • Show Up-sell Products: Select Yes to add the Up-sell Products block to the tab, or No to exclude it.
  • Show Cross-sell Products: Select Yes to add the Cross-sell Products block to the tab, or No to exclude it.
• Assign Attributes:
  
  • Choose the product attributes from the grid to display the attribute values on the tab.
  • After making your selections, click the Conditions button to complete the setup.

• Click on the (+) icon to open the condition selection field.

• In this field, you can choose an option and easily assign the tab to multiple products by selecting the desired conditions such as:
  
  • Conditions Combination
  • Product Attribute
  • Activity
  • Attribute Set
  • Category
  • Category Gear
  • Climate
  • Colour
  • Color
  • Size, etc.

• After selecting the products, click the Save Tab button to save your settings.

• Customer Front-End:
  
  • These tabs will be applied to the products, replacing the standard tabs on the frontend product pages. This means the default tabs will be disabled.

• When selecting cross-sell, up-sell, or related products, the product images are  displayed in the product tabs on the frontend.