Shop by category vertical
Overview
The Shop by Category section is a common main section used to divide and display product categories. In this demo, we use the Men / Women categories as an example.
Add section to theme
- Log in to your Theme editor and navigate to the page you would like to display this section.
- You'll see a list of available sections on the left-hand side. Locate the Add section button and click on it.
- From the list of available sections, find and select Shop by Category.
Available setup options
Sections give you several customization options to tailor them to your desired style.
OPTION
| Eyebrow Text | Small text above heading |
|---|---|
| Heading | Section heading |
| Heading Alignment | Customize heading left or center |
| View All Label | Customize the text displayed on the "view all collections" button |
| Tab Alignment | Tab refers to the category you've added, offering left/right/center alignment options. |
| Desktop Products | Number of products shown on desktop |
| Mobile Products | Number of products displayed when viewing on mobile |
| Desktop columns | Number of columns displayed in the product grid |
| Mobile columns | The number of columns displayed in the product grid when viewed on mobile. We recommend using 2 columns for the best experience. |
| Tab Font | Here you can select the font for the tab (category title). |
| Tab Font Size | Here you can customize the font size for the tab (category title). |
| Show Variant Options | Toggle variant display |
| Enable swipe on mobile | When this feature is enabled, the product grid will display as a single row with horizontal swiping to view more products when seen on a mobile viewport, instead of splitting into two columns and displaying vertically. |
Add new Category
To add a new category, follow these steps:
In the Theme Editor's left-hand panel, select the Shop by Category section, then choose the + Add Category button to add a new category.
After adding a new category, in the Collection section, select the collection you want to display and customize the Category Label.
If you're new to Shopify and want to learn more about collections, how to create them, and how to add products to them, you can find more information here.