Change number of products in shown on home page in featured collection - Brooklyn Theme

Highlighted
New Member
1 0 0

Hello,

I was wondering if anyone could point me in the right direction to changing the number of products displayed in the featured collection packaged with the Brooklyn playful theme? The demo only shows 6 products but standard I guess is 9 which seems to make the page way too long for my liking.

Thank you,

Chris

0 Likes
Highlighted
Tourist
4 0 3

 

 

Hi, I had the same need and just solved this problem on my site.

 

1. Go to featured-products.liquid

if you are using collage format, then find this code:

 {% for product in collections[section.settings.home_featured_products].products %}
            {% include 'product-grid-collage'  %}

add limit:9 before %} on the first line

 

 

 {% for product in collections[section.settings.home_featured_products].products limit:9 %}
            {% include 'product-grid-collage'  %}

 

if you are using grid format, then add limits:9 on the code about grid below:

  {% for product in collections[section.settings.home_featured_products].products limits:9 %}
            {% include 'product-grid-item' %}
          {% endfor %}

hope it works

 

Highlighted
New Member
2 0 0

Hi Sir. thanks for the script, it works like a charm. I have a small request about this, if I would like show a VIEW MORE button at the bottom of the feature collection panel when the items exceed 9, how to achieve that? Please help, thanks.

0 Likes
Highlighted
New Member
1 0 0

Major thanks yo!

0 Likes
Highlighted
Tourist
15 0 0

Hi, Did you find any solution for this "view more" button


@AmyChong wrote:

Hi Sir. thanks for the script, it works like a charm. I have a small request about this, if I would like show a VIEW MORE button at the bottom of the feature collection panel when the items exceed 9, how to achieve that? Please help, thanks.



at the bottom of the featured collection?

0 Likes
Highlighted

I know this is an old thread but to add a link to the featured collection at the bottom of a collection with a limit just add the following:

<div class="section-header text-center">
      <a class="btn btn--secondary-accent" href="{{collections[section.settings.home_featured_products].url}}">View All</a>
    </div>

 

In Brooklyn's featured-products.html, you should make this the last element of the div with id CollectionSection

Highlighted
New Member
3 0 0

Just tried this and it worked but added the button to the top instead of the bottom. Do you know if there is a way to fix this?

0 Likes
Highlighted

Make sure you insert the link at the bottom of the parent div. In this case it would be:

    </div>
<!-- INSERT HERE -->
  </div>
</div>
{% schema %}

 

Use {% schema %} as a point of reference. 

0 Likes
Highlighted
New Member
2 0 1

Thanks @tannibunni, that was almost perfect. For grid format it should be limit in line with your previous code, not limits.

 

  {% for product in collections[section.settings.home_featured_products].products limit:9 %}
  {% include 'product-grid-item' %}
{% endfor %}