How to find these settings...
- Online Store
- Customize (Theme Editor)
- Top, middle dropdown
- Collections list
- Collections list page
The Collections List is the default Shopify page that all stores have and uses the '/collections' URL. Access options in the Theme Editor by choosing 'Collections list' from the dropdown. By default, all of the published collections will be displayed
Recommended reading
In this section...
Text
Enable heading
To accommodate customizations using other sections and headings, you can opt to exclude the default heading
Use h1 tag
For SEO purposes, set the 'Heading' to use an h1 tag. NOTE: This should only be used once per page
HEADING
Title of the section or feature
Heading font
Choose either the 'Primary' or 'Secondary' heading font set in Theme Settings > Typography
Heading outline
Choose from 1 of 7 options:
- None: No outline will be applied
-
No background: An outline will be applied to the text, but the background will be transparent
- Thin
- Default
- Thick
-
Background: An outline will be applied to the text, and the background color will be applied
- Thin
- Default
- Thick
Heading size
Set the heading size with the slider. 18px is the minimum, and it steps up by 6 to a maximum of 240px
Bottom margin
Customize the bottom margin of the heading from the default to a dynamic value. -100px is the minimum, and it steps up by 5 to a maximum of 100px
Color
Choose a custom color for the heading
Responsive size
By default, text will resize based on the size of the screen. Uncheck this option to keep the text a consistent, static size. Useful when using negative margins on preceding sections
SUBHEADING
Sub title of the section or feature
Subheading font
Choose either the 'Primary' or 'Secondary' heading font set in Theme Settings > Typography
Subheading outline
Choose from 1 of 7 options:
- None: No outline will be applied
-
No background: An outline will be applied to the text, but the background will be transparent
- Thin
- Default
- Thick
-
Background: An outline will be applied to the text, and the background color will be applied
- Thin
- Default
- Thick
Sub heading size
Set the heading size with the slider. 18px is the minimum, and it steps up by 6 to a maximum of 240px
Bottom margin
Customize the bottom margin of the subheading from the default to a dynamic value. -100px is the minimum, and it steps up by 5 to a maximum of 100px
Color
Choose a custom color for the subheading
Text/Heading alignment
Text can be aligned to the left, right or centered to the container
Collections
Collections per page
Set the total number of collections per page. 1 is the minimum, and it steps up by 1 to a maximum of 50
MOBILE
Number of mobile columns
The mobile design is based on a 3 column, 768px wide layout at its widest. 1 column is the minimum, and it steps up by 1 to a maximum of 3
Mobile padding
Add horizontal spacing between blocks on screens less than 768px wide. 10px is the minimum, and it steps up by 10 to a maximum of 60px
DESKTOP
Number of desktop columns
The desktop design is based on a 5 column, 1240px wide layout at its widest. 1 column is the minimum, and it steps up by 1 to a maximum of 5
Desktop padding
Add horizontal spacing between blocks on screens larger than 768px wide. 10px is the minimum, and it steps up by 10 to a maximum of 60px
Image
Lazy load image(s)
Disable for "above the fold" images. Enable for any image that is not visible on the initial page load
Location
Select the relationship of the image and the content. Choose 1 of 2 options:
- Inline
- On top
Image
Select the image to be displayed:
- Collection: If a collection has a featured image, by default this image will be displayed
- First Product: Display the featured image of the first listed product within the collection
Image aspect ratio
The image has 4 options for display:
- Natural: Uses the height of the image
- Short (4:3): A landscape format will be applied
- Square (1:1): A square format will be applied
- Tall (2:3): A vertical format will be applied
Enable image crop
The image will crop to fill up the container format chosen with 'Image aspect ratio'. NOTE: If disabled, white space will be applied around the image. Has no effect when media aspect ratio is set to 'Natural'
Corner radius
Round the corner of the image by adjusting the slider. 0 is the minimum, and it steps up by 1 to a maximum of 100
Focal point
Similar to setting a focal point on a theme image, background images can specify the main focus of the image
Insta filter
App like filters can be applied to your images
Options
Show border
Add a 1px border to the content
Show description
Display the content description, if available
Excerpt/Description limit
Limit the excerpt text. 0 is the minimum, and it steps up by 1 to a maximum of 100
Show products
Display the collection products
Products per collection
Set the total number of products per collection. 2 is the minimum, and it steps up by 1 to a maximum of 48
Products per row
Set the total number of products per row. 2 is the minimum, and it steps up by 1 to a maximum of 6
SEO title
Add a custom SEO title for the linked content
Link text
Add text to describe what action to take for the link
Style
Choose 1 of 4 options:
- None
- Text
- Primary button
- Secondary button
Text/Heading alignment
Text can be aligned to the left, right or centered to the container
Text color
Choose a custom color for the text
Text color hover
Choose a custom color for the text hover
Button text color *
Choose a custom color for the button text hover
Line color
Choose a custom color for the lines and borders
Section
Show image sizes *
Displays the minimum recommended width for each image. If applicable, the height* will display after the width. Size is displayed in the Theme Customizer only, customers will not see this.
* NOTE: Height is approximate, and the actual height is dependent on the individual screen. Learn more
Full width *
The option of being as wide as the screen or only as wide as the content container
Background color
Choose a custom color for the background
Background color gradient
Choose a custom gradient for the background
MOBILE
Top padding
Add padding to the top of the section on screens less than 768px wide. Padding is applied to the inside of the container. 0px is the minimum, and it steps up by 5 to a maximum of 60px
Bottom padding
Add padding to the bottom of the section on screens less than 768px wide. Padding is applied to the inside of the container. 0px is the minimum, and it steps up by 5 to a maximum of 60px
Bottom margin
Add a margin to the bottom of the section on screens less than 768px wide. Margins are applied to the outside of the container. -240px is the minimum, and it steps up by 5 to a maximum of 60px
DESKTOP
Top padding
Add padding to the top of the section on screens larger than 768px wide. Padding is applied to the inside of the container. 0px is the minimum, and it steps up by 5 to a maximum of 60px
Bottom padding
Add padding to the bottom of the section on screens larger than 768px wide. Padding is applied to the inside of the container. 0px is the minimum, and it steps up by 5 to a maximum of 60px
Bottom margin
Add a margin to the bottom of the section on screens larger than 768px wide. Margins are applied to the outside of the container. -240px is the minimum, and it steps up by 5 to a maximum of 60px
Add a bottom border
A 1px border will be added between the 'Bottom padding' and the 'Bottom margin'
* NOTE: May not be available on all sections, blocks or templates