Main Collection

How to configure section Main Collection

Showing a list of products based on a category in grid or list view.

  • In the theme editor (Customize), Select Collections, then Default collection. click section Main Collection, Click the block you want to edit. Here you can make the necessary configurations.
  • Section Main Collection only works on template Collection (Collection page).

#

Main Collection on website

Product Settings

  • In the theme editor (Customize), Select Collections, then Default collection, click section Main Collection then locate Product Settings. Here you can make the necessary configurations.
  • If the default value is set, the configuration in theme settings will be applied. See instructions for configuring theme settings for product card.

#

Product Card Settings on section
  • Skin : Choose skin for product card.
  • Hover style : Select image effect when hovering.
  • Aspect Ratio : Configure aspect ratio for card images.
  • Image Size : Configure image size for card images. See more about the sizes attribute .
  • Show Rating : Show product rating. For this option to work you need to install the review app. See instructions.
  • Products Per Page : Configure the number of product each page.
  • Items Gap (px) : Configure the distance between card items.
  • Paginate : Configure pagination for section product.

Product Style

In the theme editor (Customize), Select Collections, then Default collection, click section Main Collection then locate Product Style. Here you can make the necessary configurations.

#

Product Card Style on section
  • Title color : Configure color for product card title.
  • Description Color : Configure color for product card description.
  • Image spacing (px) : Configure spacing for image product.
  • Price margin top (px) : Configure margin top for price product.
  • Title margin top (px) : Configure margin top for title product.
  • Swatch margin top (px) : Configure margin top for swatch product.
  • Rating margin top (px) : Configure margin top for rating product.
  • Description margin top (px) : Configure margin top for description product.

Section Toolbar

#

Toolbar of Main Collection section
In the theme editor (Customize), Select Collections, then Default collection, click section Main Collection then locate Section Toolbar. Here you can make the necessary configurations.

#

Toolbar configuration
  • Enable Toolbar : Display toolbar for the section.
  • Filter : Turn on filter canvas on the toolbar.
  • Result Count : Turn on result count on the toolbar.
  • Show Applied Filters : Turn on show applied filters for filter on the toolbar.
  • Switch Layout : Turn on switch layout on the toolbar.
  • Ordering : Turn on ordering on the toolbar.

Section Toolbar Mobile

#

Toolbar of Main Collection on mobile
In the theme editor (Customize), Select Collections, then Default collection, click section Main Collection then locate Section Toolbar. Here you can make the necessary configurations.

#

Toolbar configuration on mobile
  • Enable Toolbar Mobile : Display toolbar for the section.
  • Filter : Turn on filter canvas on the toolbar.
  • Result Count : Turn on result count on the toolbar.
  • Show Applied Filters : Turn on show applied filters for filter on the toolbar.
  • Ordering : Turn on ordering on the toolbar.

How to configure sidebar for section

You can see the documentation configuring the sidebar for the section.

Other configurations of section

You can see the documentation for other section configurations such as: Container, background, animation, padding...

On this page
Check