Collections List Section
Last updated
Last updated
From your Shopify admin, go to Online Store -> Themes.
Find the theme that you want to edit, and then click Customize.
Choose Collections list from the dropdown window.
Background Color
Set the background color for the section
Background Gradient
Set the background gradient for the section
Show Breadcrumb?
Enable to show the page breadcrumb.
Breadcrumb: Alignment
Align Breadcrumb to either to be center, to the left or right.
Background Color
Set the background of the breadcrumb on Desktop.
Background Gradient
Set the gradient of the breadcrumb on Desktop.
Background Color Mobile
Set the background of the breadcrumb on Mobile.
Background Gradient Mobile
Set the gradient of the breadcrumb on Mobile.
Show Page Title?
Enable to show the page title.
Page Title: Alignment
Align the Page Title to the center, to the left or right.
Title Spacing Top
Determine the spacing of the title from the top.
Title Spacing Bottom
Determine the spacing of the title from the bottom.
Description
Fill in the description of the page.
Content: Alignment
Align the description to the center, to the left or right.
Font Size
Determine the font size of the description.
Font Size Mobile
Determine the font size of the description on Mobile.
Font Weight
Select the Font weight of the description.
Spacing Top
Determine the spacing top of the description.
Spacing Bottom
Determine the spacing bottom of the description.
Text Color
Set the color for the description text.
Layout
Select the layout for the page to be either: Default (Adapt to the Body Width), FullWidth (regardless of the Body Width), and Width 1770px.
Spacing top - Desktop / Tablet / Mobile
Determine the spacing of the section from the top on Desktop, Tablet and Mobile.
Spacing bottom - Desktop / Tablet / Mobile
Determine the spacing of the section from the bottom on Desktop, Tablet and Mobile.
Show Sidebar?
Enable to show sidebar. Note that blocks rather than Custom Collection must be added for the sidebar to appear.
Show Collapsible Block?
Turn the blocks in sidebar to be collapsible.
Enable Sticky?
Fix the position of the sidebar when scrolling until the end of the collection content.
Layout
Determine how collapsible blocks are presented: Layout 1 (The collapsible blocks appear with carets). Layout 2 (The collapsible blocks appear with minus and plus icons)
Collapsible
Select the collapse state of the collapsible blocks when the page loads.
Position
Select the position of the side to be either to the Left or Right.
Select Font Type
Select the font family for the title of the sidebar.
Font Size
Determine the font size of the title of the sidebar.
Font Weight
Select the font weight of the title of the sidebar
Text Transform
Select the text transform for the title of the sidebar
Type
Select the type of the collection to display in the list: All Collection (Dynamically fetch data from the admin) Custom Collections (Set up with Custom Collection Block)
Sort by
Change the order of the All Collection Type with criteria.
Item Per Row
Select the number of collections to show per row.
Item Per Row Mobile
Select the number of collections to show per row on Mobile.
Spacing Top
Determine the spacing top of the collection list.
Spacing Bottom
Determine the spacing bottom of the collection list.
Grid Gap
Determine the gap between collections.
Maximum Collections To Show
Limit the number of collections to show.
Show 'Show More' Button?
Enable to show the 'Show More' button.
Button
Fill in the text for the show more button.
Button Font Size
Determine the font size of the button.
Button Width
Specify the width the load more button from 100px to 600px.
Button Font Weight
Select the font weight of the load more button.
Text Transform
Select the text transform of the load more button.
Spacing Top
Determine the spacing of the button from the top.
Spacing Bottom
Determine the spacing of the button from the bottom.
Color
Border Color
Background Color
Background Gradient
Hover / Active Color
Hover / Active Border Color
Hover / Active Background Color
Hover / Active Background Gradient
Set the text color, background and border color for both normal and hover states of the load more button.
Image Ratio
Select the desired ratio of the image: Adapt to Image (the original image width and height are adopted) Portrait (the image is cropped to be portrait) Square (the image is cropped to be square)
Portrait Aspect Ratio
Determine the ratio between width and height of the image if the Image Ratio: Portrait is selected.
Spacing Bottom
Determine the spacing of the image from the bottom.
Show Collection Title
Enable to show the collection title on all collection items.
Show Collection Product Count?
Enable to show the collection product amount on all collection items.
Content: Alignment
Align the collection content including title, number amount, description and button to the Left, Right or Center.
Border Color
Set the color for all of the collection items' border.
Background Color
Set the color for all of the collection items' background.
Background Gradient
Set the background gradient for all of the collection items' background.
Font Size
Determine the font size of the title on all collection items.
Font Size Mobile
Determine the font size of the title on all collection items on Mobile.
Font Weight
Select the font weight of the title on the collection items.
Text Transform
Select the text transform of the title on the collection items.
Spacing Bottom
Determine the spacing bottom of the collection title.
Text Color
Set the color for the collection title.
Background Color
Set the background color for the collection title.
Background Gradient
Set the background gradient for the collection title.
Font Size
Determine the font size of the product count on all collection items.
Font Size Mobile
Determine the font size of the product count on all collection items on Mobile.
Font Weight
Select the font weight of the number count.
Text Transform
Select the text transform for the number count.
Spacing Bottom
Determine the spacing bottom of the product count.
Text Color
Set the color for the product count.
Font Size
Determine the font size of the description.
Font Size Mobile
Determine the font size of the description on Mobile.
Font Weight
Select the font weight of the description.
Text Transform
Transform the description to be Normal, Capitalize, Uppercase or Lowercase.
Description Limit
Limit the description word count to truncate.
Spacing Bottom
Determine the spacing bottom of the description.
Text Color
Set the color for the description.
Button
Enter the text for the button. Eg: Read More
Button Style
Select the style of the button: Style 1 - normal button; Style 2 - as a Link
Button Font Size
Determine the font size of the button.
Button Width
Determine the width of the button.
Button Font Weight
Select the font weight of the button.
Text Transform
Transform the text of the button to be either normal, uppercase, lowercase or capitalize.
Spacing Bottom
Determine the spacing bottom of the button.
Color - Border Color - Background Color - Background Gradient - Hover / Active Color - Hover / Active Border Color - Hover / Active Background Color - Hover / Active Background Gradient
Set the text color, background and border color for both the normal and hover states of the buttons.
