Magento 2 Product Tabs Extension Documentation

1. INTRODUCTION

Magento 2 Product Tabs extension allows you to listing your products in tabs by variety criteria, increasing the usability of your business. The Magento 2 extension supports listing product according to tabs by categories or product fields in Slider or Load More style.

TABLE OF CONTENT

* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *

1. INTRODUCTION

2. HOW TO INSTALL & REMOVE

2.1. Install

2.2. Remove

3. MODULE CONFIGURATION

4. CMS Page CONFIGURATION

5. SUPPORT

2. HOW TO INSTALL & REMOVE

This instruction is applied for Magento 2.x.

2.1. Install:

Extract the package: bzotech-producttabs-magento2.4.x-v1.0.0.zip
Copy code to folder root magento (Magento installation folder)
Go to root magento folder, run commands:

php bin/magento setup:upgrade

Then: php bin/magento setup:static-content:deploy -f

If you are using Magento Production mode, run the command: php bin/magento setup:di:compile

2.2. Remove:

Go to root magento folder, run commands: rm -rf app/code/BzoTech/Categories

Then: php bin/magento setup:upgrade

And: php bin/magento setup:static-content:deploy -f

If you are using Magento Production mode, run the command: php bin/magento setup:di:compile

3. MODULE CONFIGURATION

After installing Magento 2 Product Tabs extension, go to Admin Dashboard -> STORES -> Settings -> Configuration -> BZOTECH.COM -> Product Tabs

Config Name	Value	Description
General Option
Enabled Extensions	Yes/No	Enable/disable the extension
Title	Input value	Set the extension’s title
Type Show	Loadmore Slider	Show the product listing type as load more or slider
Type Listing	All Only Deals Under Price	Listing products according to: all products, only deals products or under price products
Price	Input value	If Type Listing selected as Under Price, then the Price option will appear to input the price
Show Countdown Timer	Yes/No	Show or hide the countdown timer for deal products
Source Options
Filter Type	Categories Field Products	Show products listing tabs by categories or product fields
Select Categories	Multi-options	If select Filter Type as Categories, this option will be available to select the categories you want to show as tabs.
Select Fields	Multi-options	If select Filter Type as Field Products, this option will be available to select the fields you want to show as tabs.
Select Category	Multi-options	If select Filter Type as Field Products, this option will be available to select the categories you want to get products.
Order By	Name Id Date Created …	Select the order criteria.
Ordering Direction	Desc Asc	Select the order direction by descending or ascending
Product Limitation	Input value	The number of products to show in each tabs
Slider Configuration
Margin	Input value	Set the slider margin
Auto Play	Yes/No	Allow slider auto play or not
Loop	Yes/No	Allow slider loop or not
Navigation	Yes/No	Allow to show navigation or not
Dots	Yes/No	Allow to show navigation in dots or not
Mouse Drag	Yes/No	Allow to drag by mouse or not
Touch Drag	Yes/No	Allow to drag by touch or not
Number column on max screen…	1-8 columns	Allow to set the number of column for each screen size from 1 to 8 columns.

4. CMS PAGE CONFIGURATION

To add Magento 2 Product Tabs extension to any CMS page on your website, after installing, in Admin Dashboard: Go to CONTENT -> Pages -> select the page that you want to display this extension -> Edit.

Select Content -> Edit with Page Builder.

Choose edit icon.

Insert Product Tabs block to your CMS page.

IMPORTANT! If you set the params for the extension in the block on CMS pages, the extension will get these params as configurations. If you do not set params here, the extension will get the setting from Module Configuration. As below: {{block class="BzoTech\ProductTabs\Block\ProductTabs" template="BzoTech_ProductTabs::default.phtml"}}

{{block class="BzoTech\ProductTabs\Block\ProductTabs" template="BzoTech_ProductTabs::default.phtml" title="Flash Sale" type_show="slider" type_listing="deals" display_countdown="1" type_filter="categories" category_tabs="4,6" order_by="entity_id" order_dir="DESC" limitation="8" margin="30" autoplay="0" loop="0" nav="1" dots="1" mousedrag="1" touchdrag="1" screen_0="2" screen_1="2" screen_2="3" screen_3="3" screen_4="4" screen_5="4" screen_6="4" screen_7="4"}}

{{block class="BzoTech\ProductTabs\Block\ProductTabs" template="BzoTech_ProductTabs::default.phtml" title="Latest Products" type_show="loadmore" type_listing="all" display_countdown="0" type_filter="categories" category_tabs="20,11,4,6" order_by="entity_id" order_dir="DESC" limitation="8" margin="30" autoplay="0" loop="0" nav="1" dots="1" mousedrag="1" touchdrag="1" screen_0="1" screen_1="2" screen_2="3" screen_3="3" screen_4="4" screen_5="4" screen_6="4" screen_7="4"}}

{{block class="BzoTech\ProductTabs\Block\ProductTabs" template="BzoTech_ProductTabs::default.phtml" title="Men & Women" type_show="loadmore" type_listing="all" display_countdown="0" type_filter="fieldproducts" field_tabs="ordered_qty,lastest_products,num_reviews_count" category_select="11,20" order_dir="DESC" limitation="8" margin="30" autoplay="0" loop="0" nav="1" dots="1" mousedrag="1" touchdrag="1" screen_0="2" screen_1="2" screen_2="3" screen_3="3" screen_4="4" screen_5="4" screen_6="4" screen_7="4"}}

{{block class="BzoTech\ProductTabs\Block\ProductTabs" template="BzoTech_ProductTabs::default.phtml" title="Under Price $70" type_show="loadmore" type_listing="under" under_price="70" display_countdown="0" type_filter="categories" category_tabs="4,6,5" order_by="entity_id" order_dir="DESC" limitation="8" margin="30" autoplay="0" loop="0" nav="1" dots="1" mousedrag="1" touchdrag="1" screen_0="1" screen_1="2" screen_2="3" screen_3="3" screen_4="4" screen_5="4" screen_6="4" screen_7="4"}}

Params	Config Name	Description
General Option
`title`	Title	Name the title
`type_show`	Type Show	`slider` `loadmore`
`type_listing`	Type Listing	`all` = all product `deals` = only deals products `under` = under price products
`under_price`	Price	If Type Listing set as Under Price, then set Price using this param. Ex: “`70`“
`display_countdown`	Show Countdown Timer	`1` = yes `0` = no
Source Options
`type_filter`	Filter Type	`categories` = Categories `fieldproducts` = Field Products
`category_tabs`	Select Categories	If set Filter Type = Categories, use this param to set the categories you want to show as tabs by using category id. Ex: “`20,11,4,6`“
`field_tabs`	Select Fields	If select Filter Type = Field Products, use this param to set the fields you want to show as tabs. Ex “`ordered_qty,lastest_products,num_reviews_count`“
`category_select`	Select Category	If select Filter Type = Field Products, use this param to set the categories you want to get products. Ex: “`11,20`“
`order_by`	Order By	`entity_id` `entity_price` `entity_created` ….
`order_dir`	Ordering Direction	`DESC` = descending `ASC` = ascending
`limitation`	Product Limitation	Limit the number of products to show in each tabs. Ex: “`8`“
Slider Configuration
`margin`	Margin	Set the slider margin. Ex: “`30`“
`autoplay`	Auto Play	`1` = yes `0` = no
`loop`	Loop	`1` = yes `0` = no
`nav`	Navigation	`1` = yes `0` = no
`dots`	Dots	`1` = yes `0` = no
`mousedrag`	Mouse Drag	`1` = yes `0` = no
`touchdrag`	Touch Drag	`1` = yes `0` = no
`screen_0`	Number columns on max screen 480px	Set the number of column for max screen 480px from 1 to 8 columns. Ex: “`1`“
`screen_1`	Number columns on screen 481px -> 767px	Set the number of column for max screen 481px -> 767px from 1 to 8 columns. Ex: “`2`“
`screen_2`	Number columns on screen 768px -> 991px	Set the number of column for max screen 768px -> 991px from 1 to 8 columns. Ex: “`3`“
`screen_3`	Number columns on screen 992px -> 1199px	Set the number of column for max screen 992px -> 1199px from 1 to 8 columns. Ex: “`3`“
`screen_4`	Number columns on screen 1200px -> 1440px	Set the number of column for max screen 1200px -> 1440px from 1 to 8 columns. Ex: “`4`“
`screen_5`	Number columns on screen 1441px -> 1680px	Set the number of column for max screen 1441px -> 1680px from 1 to 8 columns. Ex: “`4`“
`screen_6`	Number columns on screen 1681px -> 1920px	Set the number of column for max screen 1681px -> 1920px from 1 to 8 columns. Ex: “`4`“
`screen_7`	Number columns on screen is greater than 1921px	Set the number of column for max screen greadte than 1920px from 1 to 8 columns. Ex: “`4`“

5. SUPPORT

Knowledge Base Before filing a new support ticket, please follow the steps below to assist us expedite your request. This is for everyone’s advantage and will assist to make the entire process more efficient. It’s critical, and we ask that everyone to these guidelines. Read the item documentation first: The documentation covers all the item setting and configuration. You may find the solution for your issues here. We support the item in accordance with Envato’s Support Policy: We will review and respond to the ticket within one business day (except for weekends and holiday). Please review the Envato’s Support Policy to see what is and is not covered by item support. Please keep in mind that only one website should be supported for each item purchase code. If your support license has expired, please renew it to continue receiving technical help. Important considerations for your website:

Runs the most recent version of the item and validate all Theme Requirements.
Disable any other third-party plugins you may be using to see whether this resolves the issue.
Clear and deactivate all caches, including browser, plugin, and server caches.

To open a support ticket for the item on our HELP CENTER, choose the Department and then provide the theme purchase code in the ticket and submit. Please keep in mind that providing us with information about your website and some screenshots of the problem will make it simpler for us to answer your query and assist you more quickly. Important! DO NOT REPLY TO THE TICKET VIA THE EMAIL NOTIFICATION. Any responses sent via this no-reply-email may be overlooked since our support team was unable to view them. If you have any problems with the ticket system, please contact us at [email protected] for assistance. However, the first option is more convenient and makes it easy for both of us to monitor the problems.