Collection Page FAQ

How to increase the number of products per page above the maximum 23 items from the customizer settings?

Including more products per page would be possible with a small code change but please make sure that you are using optimized images for the product featured images. 

To customize this, please open  sections/collection-page.liquid file and go to around line 60 (depending on theme version) and change the default "per" value with your own value (50 for example). 

The original code is:

{% paginate collection.products by per %}
the edited code will be:

{% paginate collection.products by 50 %}

Please also see this screenshot if it might help.

Collection description text is cut on mobile screens

The collection header was designed to include a short description about the collection. To also make large text fit the mobile screens, please add this CSS code at the end of the  assets/css_main.scss.liquid file:

.collection-data-new {
    height: auto !important;
}
.collection-data-new > div {
    position: relative !important;
    padding: 80px 50px 100px !important;
}

How to only display the collection description and not also the background image?

Our theme collection header design has the option to include the "collection text and description" (screenshot). Because this option was designed to display both elements, you need to have the collection featured image uploaded to use it (screenshot).

In case you want to customize this to keep just the text and hide the image, please add this CSS code at the end of the assets/css_main.scss.liquid file:

.collection-image { display: none;  } 
.collection-data .table-display h2, .collection-data .table-display .rte {
    color: #000 !important;
}
.collection-data-new {
    height: auto !important;
}
.collection-data-new > div {
    position: relative !important;
    padding: 80px 50px 100px !important;
}