Collection page
The Collection page template of Split: the collection banner, product rows, filters and sorting, and links to the next and previous collections.
Applies to: Split 5.1.0 and later. Added in: Split 1.0.0. Last checked: 2026-10-13 against Split 5.1.0.
The Collection page template shows one collection: a banner with the collection title, the collection's products in rows of four, and links to the next and previous collections. Every collection uses it unless you assign the collection another collection template.
Where to find it: in the theme editor, open the page selector at the top and select Collections → Default collection. The template has two sections, Collection page and Collection navigation, and you can add other sections below them.
Collection banner
The banner holds the collection title and, if you turn them on, the collection description and image. It follows Split's split-screen layout, explained on How Split is built.
- Show collection banner turns the banner on or off. Turned off, the page starts directly with the products.
- Desktop layout sets how the banner sits on screens wider than 1024 px. On phones and on tablets held upright the banner is always full width.
- Split screen: the title fills the left half of the screen. Without a collection image, the first four products fill the right half as a 2 x 2 grid; the next products continue below, four per row. With a collection image, the image fills the right half and the products start below, four per row.
- Full width: the title is centered across the whole width, over the collection image if you show it. The products start below, four per row.
- Show collection description adds the collection description under the title.
- Show collection image shows the collection image: beside the title in Split screen, behind the title in Full width. Collections without an image show the banner without one.
- Image overlay background and Image overlay text set the colors used when the title sits over the collection image: in the Full width layout, and on phones and tablets held upright in both layouts. Leave them transparent to keep the theme colors.
The description and the image come from the collection itself. Change them in Shopify admin → Products → Collections.
Product grid
- Product rows sets how many rows of products each page shows, from 2 to 62. Each row holds four products on desktop and two on mobile.
- The products show as product cards. Their image ratio, badges, color swatches, ratings and quick buy button come from Product card theme settings.
- When a collection has more products than one page holds, numbered page links show under the grid.
Setting up filters and sorting
Filters and sorting open in the filter drawer from the Filter and sort button above the products, on desktop and on mobile. The drawer uses the Sidebar colors, like the other drawers.
To configure the filters on your store you will need to install Shopify Search & Discovery app.
Choose your filters in Search & Discovery
In Shopify admin, open the Search & Discovery app → Filters and add the filters you want, such as availability, price, product type, vendor, color or size. Shopify decides which filters exist and in which order they show.
Turn on filtering and sorting
In the theme editor, open Collections → Default collection, select Collection page and turn on Enable filtering and Enable sorting. Both are on by default.
Set the image filter layout
If a filter uses the image presentation in Search & Discovery, set Image filter layout to 1 column or 2 columns to choose how the images line up in the drawer.
Check the filters on the storefront
Open a collection and select Filter and sort. Filters with the swatch presentation show color circles or swatch images; filters with the image presentation show the value images.
With only Enable filtering on, the button says Filter; with only Enable sorting on, it says Sort. The sort options (Featured, Best selling, price, alphabetical, date) come from Shopify.
Collection navigation
The Collection navigation section adds large links to other collections under the products. It is automatic: you do not pick the collections.
- Layout set to Split screen shows the previous and the next collection side by side, each half the width of the screen. Full width shows only the next collection, across the whole width.
- The order is the order of all your store's collections, as Shopify lists them. The home page collection (
frontpage) is skipped. After the last collection, the links start again from the first one. - Show collection image shows each linked collection's image behind its title. A collection without an image uses the featured image of its first product.
- Text and Background under Custom colors set this section's own colors. Leave them transparent to keep the theme colors.
To remove the links, hide or remove the Collection navigation section in the template.
How many products show per page?
Four times the number of Product rows. The default of 3 rows shows 12 products per page; the range of 2 to 62 rows gives 8 to 248 products per page. The number of products per row is fixed: four on desktop and two on mobile.
Why do I not see any filters?
Because the store has no filters set up, or Enable filtering is off. Filters are controlled by Shopify, not by Split: set them up in the Search & Discovery app. Split shows whatever filters Shopify sends for the collection, and greys out a filter value that matches no products.
Can I use a different layout for some collections?
Yes. Create a second collection template and assign it to those collections.
Create the template
In the theme editor, open the page selector, select Collections, then Create template. Base it on Default collection and give it a name.
Change its sections
Change the settings of the new template, for example Desktop layout, or add sections above or below the products. The Cuber preset ships an example, collection.accessories, with a Video: background section above the products.
Assign it to collections
In Shopify admin → Products → Collections, open each collection and select the new template under Theme template.
All Collection page settings
Every setting of each part, with its type and default.
The same section is also on the alternate template Collections → accessories.
Collection page section: Collection banner
Where to find it: Collections → Default collection → Collection page → Collection banner
Show collection banner (checkbox, default: on): Shows the banner with the collection title above the products. Turned off, the page starts with the product grid, four products per row.
Desktop layout (dropdown, default: Split screen): Sets the banner layout on screens wider than 1024 px: Split screen puts the title on the left half, with the collection image or the first four products on the right half; Full width centers the title across the page, over the collection image if shown. Options: Split screen, Full width.
Show collection description (checkbox, default: off): Shows the collection description from Shopify admin under the collection title.
Show collection image (checkbox, default: off): Shows the collection image from Shopify admin: beside the title in Split screen, behind the title in Full width and on mobile.
To change collection descriptions or collection images, edit your collections in Shopify admin.
Image overlay background (color, default: transparent): Sets a color laid over the collection image when the title sits on it: in the Full width layout, and on phones and on tablets held upright.
Image overlay text (color, default: transparent): Sets the title and description color over the collection image: in the Full width layout, and on phones and on tablets held upright.
Optional color control for when collection images are shown behind text.
Collection page section: Product grid
Where to find it: Collections → Default collection → Collection page → Product grid
Product rows (slider 2 to 62, default: 3): Sets how many rows of products each page shows. Each row holds four products on desktop and two on mobile, so the default of 3 rows shows 12 products per page.
Collection page section: Filtering and sorting
Where to find it: Collections → Default collection → Collection page → Filtering and sorting
Enable filtering (checkbox, default: on): Shows the filters set up in Shopify's Search & Discovery app in the filter drawer, opened from the Filter and sort button above the products.
Enable sorting (checkbox, default: on): Adds the Sort by menu, with Shopify's sort options, to the filter drawer.
Image filter layout (dropdown, default: 1 column): Sets whether filter values with the image presentation line up in one or two columns in the filter drawer. Options: 1 column, 2 columns.
Where to find it: Collections → Default collection → Collection navigation. The same section is also on the alternate template Collections → accessories.
Layout (dropdown, default: Split screen): Sets the links under the products: Split screen shows the previous and the next collection side by side, Full width shows only the next collection. The order is the order of all your store's collections, without the home page collection. Options: Split screen, Full width.
Show collection image (checkbox, default: off): Shows each linked collection's image behind its title.
Collection navigation section: Custom colors
Where to find it: Collections → Default collection → Collection navigation → Custom colors
Text (color, default: transparent): Sets the text color of the collection links. Leave it transparent to use the theme colors.
Background (color, default: transparent): Sets the background color of the collection links, or the overlay color over their images. Leave it transparent to use the theme colors.
Related pages
- Product card theme settings: the image ratio, badges, color swatches and quick buy of the products in the grid.
- How Split is built: the split-screen halves and screen heights the banner follows.
- Drawers: the filter drawer and the Sidebar colors.
- Collections list page: the page that lists all your collections.
- Search page: the same filters and sorting for search results.
Quick view
The Quick view template of Split sets the popup that opens from quick buy on product cards: image fit, variant selector, swatches and disclosures.
Collections list page
The Collections list page template of Split shows all your collections or a selection, sorted the way you choose, with text over the images.