Product tabs
Learn how to feature products from hand-picked collections in Product tabs
Product tabs display products from selected collections in an engaging and attractive section.
You can show off new collections, best-sellers, or on sales items all together so customers can explore them right away!
How to add a Product tabs section
Steps
In the theme editor (Customize), click Add section.
Locate Product tabs.
Make necessary changes.
Save.
How to edit a Product tabs section
Section settings
Section header
Layout: The position of the section header vs the tabs.
Heading size: The font size of the section header.
Highlight text
How to apply Highlight text to the section heading and block headings?
Grid settings
Set the maximum number of products to show per collection (between 2-12 products) and the number of columns on desktop (between 2-6 columns).
You can also adjust the gap between columns and rows.
Product cards
Image ratio: The ratio of image shown on product cards.
Mobile layout
Number of columns on mobile: 1/ 2 columns.
Enable swipe on mobile: Show the product list as swipeable on mobile view instead of the default grid layout.
View all button
Show on heading section on desktop: If the option is selected, the button will display beside the tab names. By default, the view all button when added will show at the end of the product list.
Button label: Add a label to show the button.
Button link: Link the button to your desired page. For example: Your all products page.
Button style: Primary button/ Secondary button/ Underline button.
Tab settings
Select a navigation style for your section.
Block settings
Insert the Tab name and select a Collection to display the products of it.
Last updated
