How do you change the upper limit on the number of products displayed on collection pages in Craft 2.0 theme? I have found instructions but none of them map onto the back end code of this theme. Thanks in advance.
1 Like
Here are the steps to follow:
1.In your Shopify admin, go to “Online Store” > “Themes” and click “Actions” > “Edit code” for your current theme.
2.In the left-hand menu, navigate to “Templates” and find the template file for your collection page (usually named collection.liquid).
3.Open the collection.liquid file and locate the code that generates the product grid. This should be a for loop that iterates through the collection’s products.
4.Within the for loop, you should see a line of code that sets the limit on the number of products displayed. It may look something like this:
{% for product in collection.products limit: 12 %}
The limit: 12 part specifies the maximum number of products to display. Change this number to your desired limit.
Thanks, ZestardTech.
I searched for files with ‘collection’ in the title and liquid appended on the end. I then searched within the files for ‘limit’ and didn’t see a line like above. However, you can see a line with ‘limit’ in it in the featured.collection.liquid, for example. See below for the line, ‘{%- for product in section.settings.collection.products limit: section.settings.products_to_show -%}.’
I wonder if the code controlling limit of products displayed per page for a collection is inserted somewhere else for this theme.
{{ 'component-card.css' | asset_url | stylesheet_tag }}
{{ 'component-price.css' | asset_url | stylesheet_tag }}
{{ 'component-slider.css' | asset_url | stylesheet_tag }}
{{ 'template-collection.css' | asset_url | stylesheet_tag }}
{%- if section.settings.enable_quick_add -%}
{{ 'quick-add.css' | asset_url | stylesheet_tag }}
{%- endif -%}
{%- style -%}
.section-{{ section.id }}-padding {
padding-top: {{ section.settings.padding_top | times: 0.75 | round: 0 }}px;
padding-bottom: {{ section.settings.padding_bottom | times: 0.75 | round: 0 }}px;
}
@media screen and (min-width: 750px) {
.section-{{ section.id }}-padding {
padding-top: {{ section.settings.padding_top }}px;
padding-bottom: {{ section.settings.padding_bottom }}px;
}
}
{%- endstyle -%}
{%- liquid
assign products_to_display = section.settings.collection.all_products_count
if section.settings.collection.all_products_count > section.settings.products_to_show
assign products_to_display = section.settings.products_to_show
assign more_in_collection = true
endif
assign columns_mobile_int = section.settings.columns_mobile | plus: 0
assign show_mobile_slider = false
if section.settings.swipe_on_mobile and products_to_display > columns_mobile_int
assign show_mobile_slider = true
endif
assign show_desktop_slider = false
if section.settings.enable_desktop_slider and products_to_display > section.settings.columns_desktop
assign show_desktop_slider = true
endif
-%}
{%- if section.settings.title != blank -%}
## {{ section.settings.title }}
{%- endif -%}
{%- if section.settings.description != blank
or section.settings.show_description
and section.settings.collection.description != empty
-%}
{%- if section.settings.show_description -%}
{{ section.settings.collection.description }}
{%- else -%}
{{ section.settings.description -}}
{%- endif %}
{%- endif -%}
{%- if section.settings.show_view_all and more_in_collection -%}
{{ 'sections.featured_collection.view_all' | t }}
{%- endif -%}
{% schema %}
{
"name": "t:sections.featured-collection.name",
"tag": "section",
"class": "section",
"disabled_on": {
"groups": ["header", "footer"]
},
"settings": [
{
"type": "inline_richtext",
"id": "title",
"default": "Featured collection",
"label": "t:sections.featured-collection.settings.title.label"
},
{
"type": "select",
"id": "heading_size",
"options": [
{
"value": "h2",
"label": "t:sections.all.heading_size.options__1.label"
},
{
"value": "h1",
"label": "t:sections.all.heading_size.options__2.label"
},
{
"value": "h0",
"label": "t:sections.all.heading_size.options__3.label"
}
],
"default": "h1",
"label": "t:sections.all.heading_size.label"
},
{
"type": "richtext",
"id": "description",
"label": "t:sections.featured-collection.settings.description.label"
},
{
"type": "checkbox",
"id": "show_description",
"label": "t:sections.featured-collection.settings.show_description.label",
"default": false
},
{
"type": "select",
"id": "description_style",
"label": "t:sections.featured-collection.settings.description_style.label",
"options": [
{
"value": "body",
"label": "t:sections.featured-collection.settings.description_style.options__1.label"
},
{
"value": "subtitle",
"label": "t:sections.featured-collection.settings.description_style.options__2.label"
},
{
"value": "uppercase",
"label": "t:sections.featured-collection.settings.description_style.options__3.label"
}
],
"default": "body"
},
{
"type": "collection",
"id": "collection",
"label": "t:sections.featured-collection.settings.collection.label"
},
{
"type": "range",
"id": "products_to_show",
"min": 2,
"max": 25,
"step": 1,
"default": 4,
"label": "t:sections.featured-collection.settings.products_to_show.label"
},
{
"type": "range",
"id": "columns_desktop",
"min": 1,
"max": 5,
"step": 1,
"default": 4,
"label": "t:sections.featured-collection.settings.columns_desktop.label"
},
{
"type": "checkbox",
"id": "full_width",
"label": "t:sections.featured-collection.settings.full_width.label",
"default": false
},
{
"type": "checkbox",
"id": "show_view_all",
"default": true,
"label": "t:sections.featured-collection.settings.show_view_all.label"
},
{
"type": "select",
"id": "view_all_style",
"label": "t:sections.featured-collection.settings.view_all_style.label",
"options": [
{
"value": "link",
"label": "t:sections.featured-collection.settings.view_all_style.options__1.label"
},
{
"value": "outline",
"label": "t:sections.featured-collection.settings.view_all_style.options__2.label"
},
{
"value": "solid",
"label": "t:sections.featured-collection.settings.view_all_style.options__3.label"
}
],
"default": "solid"
},
{
"type": "checkbox",
"id": "enable_desktop_slider",
"label": "t:sections.featured-collection.settings.enable_desktop_slider.label",
"default": false
},
{
"type": "select",
"id": "color_scheme",
"options": [
{
"value": "accent-1",
"label": "t:sections.all.colors.accent_1.label"
},
{
"value": "accent-2",
"label": "t:sections.all.colors.accent_2.label"
},
{
"value": "background-1",
"label": "t:sections.all.colors.background_1.label"
},
{
"value": "background-2",
"label": "t:sections.all.colors.background_2.label"
},
{
"value": "inverse",
"label": "t:sections.all.colors.inverse.label"
}
],
"default": "background-1",
"label": "t:sections.all.colors.label",
"info": "t:sections.all.colors.has_cards_info"
},
{
"type": "header",
"content": "t:sections.featured-collection.settings.header.content"
},
{
"type": "select",
"id": "image_ratio",
"options": [
{
"value": "adapt",
"label": "t:sections.featured-collection.settings.image_ratio.options__1.label"
},
{
"value": "portrait",
"label": "t:sections.featured-collection.settings.image_ratio.options__2.label"
},
{
"value": "square",
"label": "t:sections.featured-collection.settings.image_ratio.options__3.label"
}
],
"default": "adapt",
"label": "t:sections.featured-collection.settings.image_ratio.label"
},
{
"type": "checkbox",
"id": "show_secondary_image",
"default": false,
"label": "t:sections.featured-collection.settings.show_secondary_image.label"
},
{
"type": "checkbox",
"id": "show_vendor",
"default": false,
"label": "t:sections.featured-collection.settings.show_vendor.label"
},
{
"type": "checkbox",
"id": "show_rating",
"default": false,
"label": "t:sections.featured-collection.settings.show_rating.label",
"info": "t:sections.featured-collection.settings.show_rating.info"
},
{
"type": "checkbox",
"id": "enable_quick_add",
"default": false,
"label": "t:sections.featured-collection.settings.enable_quick_buy.label"
},
{
"type": "header",
"content": "t:sections.featured-collection.settings.header_mobile.content"
},
{
"type": "select",
"id": "columns_mobile",
"default": "2",
"label": "t:sections.featured-collection.settings.columns_mobile.label",
"options": [
{
"value": "1",
"label": "t:sections.featured-collection.settings.columns_mobile.options__1.label"
},
{
"value": "2",
"label": "t:sections.featured-collection.settings.columns_mobile.options__2.label"
}
]
},
{
"type": "checkbox",
"id": "swipe_on_mobile",
"default": false,
"label": "t:sections.featured-collection.settings.swipe_on_mobile.label"
},
{
"type": "header",
"content": "t:sections.all.padding.section_padding_heading"
},
{
"type": "range",
"id": "padding_top",
"min": 0,
"max": 100,
"step": 4,
"unit": "px",
"label": "t:sections.all.padding.padding_top",
"default": 36
},
{
"type": "range",
"id": "padding_bottom",
"min": 0,
"max": 100,
"step": 4,
"unit": "px",
"label": "t:sections.all.padding.padding_bottom",
"default": 36
}
],
"presets": [
{
"name": "t:sections.featured-collection.presets.name"
}
]
}
{% endschema %}
I found this Shopify page on changing the number of products shown on collection pages:
Could the main-collection-product-grid.liquid be the file to change?
Per the above instructions you are to amend the following code:
{% paginate collection.products by 9 %}
The top line of this code section of main-collection-product-grid.liquid file might be pertinent:
{%- paginate collection.products by section.settings.products_per_page -%}
{% comment %} Sort is the first tabbable element when filter type is vertical {% endcomment %}
{%- if section.settings.enable_sorting and section.settings.filter_type == 'vertical' -%}
{%- endif -%}
Update:
Shopify limits in Craft 2.0 the number of products that can be shown to 24.
I went into edit code mode. Under Templates, I selected collection.one-collection-page.json (this is a template that I hand-created to display each collection). I found this line of code:
“products_per_page”: 24,
When I change 24 to the number of patterns that I want to show per page, Shopify won’t accept it as the upper limit is a strict 24.
Does anyone have any other workarounds for this? Thanks in advance, everyone.
If it is of help, this is the code for my personally created collections page template:
{
"sections": {
"main-collection-banner": {
"type": "main-collection-banner",
"custom_css": [
],
"settings": {
"show_collection_description": true,
"show_collection_image": false,
"color_scheme": "background-1"
}
},
"fb6ff6b3-bd79-4459-94e0-dc0a5133e722": {
"type": "rich-text",
"blocks": {
"template--18680120148245__fb6ff6b3-bd79-4459-94e0-dc0a5133e722-16830434505f5bc28d-0": {
"type": "heading",
"settings": {
"heading": "",
"heading_size": "h1"
}
},
"template--18680120148245__fb6ff6b3-bd79-4459-94e0-dc0a5133e722-16830434505f5bc28d-1": {
"type": "text",
"settings": {
"text": "### Click on a pattern below to buy fabric or home goods with that pattern on it. <\/h3>"
}
},
"template--18680120148245__fb6ff6b3-bd79-4459-94e0-dc0a5133e722-16830434505f5bc28d-2": {
"type": "button",
"settings": {
"button_label": "",
"button_link": "",
"button_style_secondary": false,
"button_label_2": "",
"button_link_2": "",
"button_style_secondary_2": false
}
}
},
"block_order": [
"template--18680120148245__fb6ff6b3-bd79-4459-94e0-dc0a5133e722-16830434505f5bc28d-0",
"template--18680120148245__fb6ff6b3-bd79-4459-94e0-dc0a5133e722-16830434505f5bc28d-1",
"template--18680120148245__fb6ff6b3-bd79-4459-94e0-dc0a5133e722-16830434505f5bc28d-2"
],
"settings": {
"desktop_content_position": "center",
"content_alignment": "center",
"color_scheme": "background-1",
"full_width": true,
"padding_top": 0,
"padding_bottom": 0
}
},
"main-collection-product-grid": {
"type": "main-collection-product-grid",
"settings": {
"products_per_page": 24,
"columns_desktop": 5,
"image_ratio": "square",
"show_secondary_image": false,
"show_vendor": false,
"show_rating": false,
"enable_quick_add": false,
"enable_filtering": false,
"filter_type": "horizontal",
"enable_sorting": false,
"columns_mobile": "2",
"padding_top": 20,
"padding_bottom": 68
}
}
},
"order": [
"main-collection-banner",
"fb6ff6b3-bd79-4459-94e0-dc0a5133e722",
"main-collection-product-grid"
]
}
I ended up finding a solution that allowed me to have 25 products (sections) displayed in the product grid that is shown on any given collection page. Here is the solution for those wanting to do the same:
This is important for our store as each collection shows variations in color of the same pattern (for printing on fabrics, wallpaper and other home goods) and customers can now compare all the color variations of a pattern in real time without having to click and go to another page.
I had to make changes in two pages and only certain numbers work (see comments in the above linked-thread that has the solution).
We don’t plan on having any collections that go beyond 28 at the most so this is perfect for us.