Product tabs
Learn how to feature products from hand-picked collections in Product tabs
Last updated
Learn how to feature products from hand-picked collections in Product tabs
Last updated
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!
Steps
In the theme editor (Customize), click Add section.
Locate Product tabs.
Make necessary changes.
Save.
Layout: The position of the section header vs the tabs.
Heading size: The font size of the section header.
How to apply Highlight text to the section heading and block headings?
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.
Image ratio: The ratio of image shown on product cards.
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.
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.
Select a navigation style for your section.
Insert the Tab name and select a Collection to display the products of it.
