Concept Documentation
Open a Store for FREEExclusive OffersServicesResources
  • Exclusive Offers 🔥
  • Greeting + Useful Resources
  • Changelog
  • Overview
    • Full Theme Features
    • Online Store 2.0
      • Color Gradient
      • Dynamic Source
  • Installation
    • Install Theme 🎯
    • Update Theme 🔔
      • Update Theme
      • Theme Update Service
    • Install App
      • Product Review
      • Shopify Search & Discovery
      • Shopify Forms
  • Basic Configuration
    • Customer registration
    • Shipping rates
    • Location
    • Language
    • Payment
    • Currency
    • Navigation
  • Theme Settings
    • General
    • Colors
      • Color schemes
    • Typography
    • Multiple layouts
    • Animations
    • Buttons
    • Variant pills
    • Inputs
    • Product cards
    • Media
    • Dropdowns and pop-ups
    • Drawers
    • Badges
    • Social Media
    • Search behavior
    • Favicon
    • Currency format
    • Cart drawer
    • Login
    • Multitasking bar
    • Preloading screen
    • Custom CSS
  • Header Group
    • Demo & Settings Data
    • Advanced settings
      • Dropdown menu
      • Mega menu
    • Header
    • Announcement bar
      • Announcement
    • Link list
      • Text
      • Menu
    • Countdown Showcase Hero
      • Heading
      • Countdown
      • Button
      • Logo
  • Footer Group
    • Demo & Settings Data
    • Footer
      • Menu
      • Text
      • Email signup
      • Social
    • Footer bottom
  • Section
    • Section on every page
    • Before/after image
    • Blog posts
      • [Block] Tags
      • [Block] Heading
      • [Block] Content
      • [Block] Author
      • [Block] Date
      • [Block] Button
    • Brand list
      • [Block] Brand
    • Carousel images
      • [Block] Slide
    • Category list
      • [Block] Category
    • Category slide
      • [Block] Slide
    • Collapsible collection
      • [Block] Collapsible row
    • Collection banner
      • [Block] Collection
    • Collection video
      • [Block] Video
    • Collection with bundle
      • [Block] Slide
    • Collection with product
      • [Block] Slide
    • Coutdown showcase hero
      • [Block] Heading
      • [Block] Countdown
      • [Block] Button
      • [Block] Logo
    • Collage
      • [Block] Image
      • [Block] Text
    • Collapsible content
      • [Block] Collapsible row
      • [Block] Caption
    • Collection list
      • [Block] Collection
    • Contact form
      • [Block] Heading
      • [Block] Caption
      • [Block] Text
      • [Block] Button
    • Custom tab
      • [Block] Custom tab
    • Custom liquid
    • Double banner
      • [Block] Heading
      • [Block] Button
    • Email signup
      • [Block] Heading
      • [Block] Email form
    • Featured blog post
    • Featured collection
      • [Block] Heading
      • [Block] Information
    • Featured collection tab
      • [Block] Tab
    • Featured images
      • [Block] Image
    • Featured product
      • [Block] Text
      • [Block] Title
      • [Block] Vendor
      • [Block] Price
      • [Block] Information
      • [Block] Inventory status
      • [Block] Countdown
      • [Block] Variant picker
      • [Block] Buy buttons
      • [Block] Description
      • [Block] Custom liquid
      • [Block] Product rating
      • [Block] Icon with text
    • Featured product tab
      • [Block] Tab
    • Icon with text
      • [Block] Icon with text item
    • Image banner
      • [Block] Heading
      • [Block] Text
      • [Block] Button
      • [Block] Link
      • [Block] Countdown
      • [Block] Thumbnail images
      • [Block] Image with text
    • Image gallery
      • [Block] Image
    • Image with collection
    • Image with text
      • [Block] Logo
      • [Block] Subheading
      • [Block] Heading
      • [Block] Text
      • [Block] Navigation
      • [Block] Link
    • Instagram
      • [Block] Image
    • Lookbook
      • [Block] Image
    • Map
    • Marquee
      • [Block] Marquee
    • Multicolumn
      • [Block] Column
      • [Block] Column: Text
    • Multiple options
      • [Block] Options
    • Outstanding reviews
      • [Block] Slide
    • Page
    • Product column
      • [Block] Collection
    • Quotes
      • [Block] Slide
      • [Block] Heading
    • Rich text
      • [Block] Heading
      • [Block] Caption
      • [Block] Text
      • [Block] Buttons
    • Slideshow
      • [Block] Slide
      • [Block] Lookbook
    • Slide banner
      • [Block] Slide
    • Spotlight products
    • Testimonial
      • [Block] Slide
    • Visual hightlight
      • [Block] Slide
    • Video
      • [Block] Heading
      • [Block] Text
      • [Block] Button
      • [Block] Countdown
    • Video with text
      • [Block] Caption
      • [Block] Heading
      • [Block] Text
      • [Block] Button
  • 🔥POPUP GROUP
    • Before you leave
    • Newsletter popup
      • Heading
      • Text
      • Newsletter
    • Recently purchased
    • Toolbar mobile
      • Search
      • Account
      • Cart
      • Wishlist
      • Link
  • Collection
    • Demo & Settings Data
    • Collection
      • Collection banner
      • Product grid
    • Storefront filtering
  • Collection List
    • Collection list page
  • Product
    • Demo & Settings Data
    • Product
    • Product information
      • Text
      • Title
      • Vendor
      • Price
      • Positive vibes bundle
      • Information
      • Inventory status
      • Countdown
      • Variant picker
      • Buy buttons
      • Description
      • Custom liquid
      • Collapsible row
      • Pop-up
      • Drawer
      • Product rating
      • Complementary products
      • Icon with text
      • Trust badge
      • Ask an expert
      • Size chart
    • Product recommendations
    • Pre-order product
    • Local pickup
  • Blogs
    • Demo & Settings Data
    • Blogs page
    • Blog posts
      • Side block: Products form collection
      • Side block: Collections list
      • Side block: Brands list
      • Side block: Posts list
      • Side block: Tags list
      • Side block: Image
      • Side block: Text
  • Article
    • Demo & Settings Data
    • Article page
    • Blog post
      • Featured image
      • Title
      • Rich text
      • Textarea
      • Image with text
      • Content
      • Lookbook
      • Quote
      • Tag
      • Side block: Products form collection
      • Side block: Collections list
      • Side block: Brands list
      • Side block: Posts list
      • Side block: Tags list
      • Side block: Image
      • Side block: Text
    • Comment
  • Cart
    • How to set up sections for Cart Page?
    • Items
  • Pages
    • How to create a page?
    • Default page
  • Other pages
    • Search page
    • Password page
      • Heading
      • Paragraph
      • Email form
    • 404 page
    • Knowledge base
      • Getting started in Shopify
      • Shopify help center
      • Shopify developers platform
    • FAQs
  • Theme Support
Powered by GitBook
On this page
  • How to set up sections for Collection list page?
  • Collection list
  • Collection content
  • Button
  • Section padding
  • Block Collection
  1. Collection List

Collection list page

PreviousStorefront filteringNextDemo & Settings Data

Last updated 9 months ago

Visit our demo to see all available previews: .

How to set up sections for Collection list page?

  1. From your Shopify admin, go to Online Store -> Themes.

  2. Find the theme that you want to edit, and then click Customize.

  3. Choose Collection list from the dropdown window.

  4. From the side menu, select Collection list page. Configure the collection list page in the setting on the side with the following settings.

Setting
Description

Layout style

Select the layout style for the section:

  • Classic

  • Masonry

Section width

Select the section width from the dropdown menu:

  • Full width

  • Page width

  • Customized width

Customize width

Determines the width of the section when you choose "Customized width" option. Can be from 1200px to 1800px, increasing arithmetically of 50px (pixel)

Show breadcrumb?

Select this checkbox to show/hide breadcrumb

Breadcrumb: size

Font size of text:

  • Default

  • XX-Small

  • X-Small

  • Small

  • Medium

  • Large

  • X-Large

  • XX-Large

  • XXX-Large

Breadcrumb: alignment

Set horizontal alignment for content inside section containers.

  • Left

  • Center

  • Right

Breadcrumb: padding top

Determines the height of the top inner space of the breadcrumb. Can be from 0px to 100px, increasing arithmetically of 1px (pixel)

Breadcrumb: padding bottom

Determines the height of the bottom inner space of the breadcrumb. Can be from 0px to 100px, increasing arithmetically of 1px (pixel)

Heading

Add text to display as a section heading. (Leave the field blank to hide the heading)

Heading size

Font size of text:

  • Default

  • XX-Small

  • X-Small

  • Small

  • Medium

  • Large

  • X-Large

  • XX-Large

  • XXX-Large

Heading alignment

Set horizontal alignment for content inside section containers.

  • Left

  • Center

  • Right

Heading top margin

Determines the height of the top outside space of the section. Can be from 0px to 100px, increasing arithmetically of 1px (pixel)

Heading bottom margin

Determines the height of the bottom outside space of the section. Can be from 0px to 100px, increasing arithmetically of 1px (pixel)

Collection list

Setting
Description

Collection type

Select the collection type for the section:

  • All collection

  • Custom collection

Sort collections by

Select the sort order of the collection, which is set in the collection pages of the Admin from the dropdown menu:

  • Alphabetically, A-Z.

  • Alphabetically, Z-A.

  • Date, new to old.

  • Date, old to new.

  • Product count, high to low.

  • Product count, low to high.

Number of columns on desktop

The number of products from the products to display on desktop. Must be an even number. Minimum: 1. Maximum: 5 (Not For Layout 'Masonry')

Number of columns on mobile

Select the number of columns to display on mobile devices from the dropdown menu:

  • 1 column

  • 2 columns

(Not For Layout 'Masonry')

Grid between

Determines the grid spacing between on desktop devices. Can be from 10px to 50px, increasing arithmetically of 1px (pixel).

Grid between tablet

Determines the grid spacing between on tablet devices. Can be from 10px to 50px, increasing arithmetically of 1px (pixel).

Image ratio

Select the ratio of image from the dropdown menu:

  • Adapt to image

  • Portrait.

  • Square.

Collection content

Setting
Description

Hide collection title

Enable/disable checkbox

Show collection product count

Enable/disable checkbox

Button

Setting
Description

Button label

Add text to display as a button on the section (Leave the field blank to hide the link)

Section padding

Setting
Description

Top padding

Determines the height of the top inner space of the main section. Can be from 0px to 100px, increasing arithmetically of 1px (pixel).

Bottom padding

Determines the height of the bottom inner space of the main section. Can be from 0px to 100px, increasing arithmetically of 1px (pixel).


Block Collection

Setting
Description

Choose collection

Select a collection to add all its products to the block

Upload image

Set up an image

(Add images by editing your collections. )

Click here
Learn more