The Collection list page is an important area on your website where all or a group of your product collections are displayed. This page helps customers easily discover the different product categories you offer.
Customizing the options of the collection list page allows you to adjust the appearance, arrangement, and display of the collections, thereby providing a better shopping experience for customers.
You can access a Collection list page by following these simple steps:
Step 01: From Shopify Admin, click on Online Store > Select Themes > In the Current theme section, click the Customize button.
Step 02: In the theme editor (Customize), navigate to the Collection list page > click the Sections button > you will see the Collection list page displayed in the template area.
After accessing the Collection list page, you can configure some general options for the Collection list page below:
Reveal on scroll: An on/off toggle. If enabled, the collections may display a dynamic effect when the user scrolls the page.
Make section full width: An on/off option to extend the entire width of the collection section across the page, not limited by the main content area.
Color scheme: Allows you to choose a pre-set color palette (Scheme) for this section of the page.
All of your collections are listed by default. To customize your list, choose 'Selected' and add collections.
Select collections to show:
+ All: A radio button selected by default, displaying all collections.
+ Selected: A radio button to choose to display specific collections. When selected, you can select specific collections using the "Select collection list" option below.
Select collection list: A dropdown or button that allows you to choose the specific collections you want to display if you have selected "Selected" above.
Sort collections by: Allows you to choose how to order the collections. Options include: Alphabetically A-Z; Alphabetically Z-A; Date, new to old; Date, old to new; Product count, high to low; or Product count, low to high. Sorting only applies when 'All' is selected
Style: Allows you to choose how the collection information is displayed on the thumbnail image. Options inlcude: Overlay; Overlay with blur; Overlay with underline.
Image ratio: Allows you to choose the aspect ratio for the collection thumbnail images
Collections per row on desktop: Allows you to adjust the number of collections displayed in each row on desktop screens.
Top padding: Sets the space between the top of the section and the element above it (in pixels).
Bottom padding: Sets the space between the bottom of the section and the element below it (in pixels).
Mobile top padding: Sets the space between the top of the section and the element above it (in pixels) on mobile devices.
Mobile bottom padding: Sets the space between the bottom of the section and the element below it (in pixels) on mobile devices.
Page width: Adjusts the maximum width of the page layout in pixels.