Featured Collection max products shown

Technical Q&A
1

Hello, I’m trying to set a certain amount of max. products shown on a featured collection on desktop and a different amount on mobile, for example 4 on desktop and 6 on mobile. Is there a way to do this?

2

Hi,

At Featured Collection Section Modify the Section Code

Code example

{% assign product_limit_desktop = section.settings.product_limit_desktop | default: 4 %}
{% assign product_limit_mobile = section.settings.product_limit_mobile | default: 6 %}

{% assign counter = 0 %}

    {% for product in collection.products %}
        {% assign counter = counter | plus: 1 %}
        

            
        

    {% endfor %}

Add css to Hiding Elements

Css code example

/* Hide products beyond the limit on desktop */
@media screen and (min-width: 768px) {
    .featured-collection .hide-desktop {
        display: none;
    }
}

/* Hide products beyond the limit on mobile */
@media screen and (max-width: 767px) {
    .featured-collection .hide-mobile {
        display: none;
    }
}