Minimal Theme - Increase to 5 recommended products on product detail page

Solved
tinooze
Excursionist
15 1 6

Hi,

I try to keep the subject as clear as possible.

Right now in Mimimal theme, no matter if it's in Wide or Grid layout, the Recommended Products section on Product Detail page is always 4 items. Is there anyone to increase it up to 5?

I think it's nice to have as many recommended products as possible like AMZ.

--

I also did try to increase the layout by changing half-quarter to half-fifth, thinking it would reveal the next one. Usually it would work on Collection page but it appears the Recommended Products section is something else. So the 4 of them just shrink to a 4-column grid without appearing the 5th item, unfortunately.

Thank you in advance.

 

Accepted Solution (1)

Accepted Solutions
tinooze
Excursionist
15 1 6

This is an accepted solution.

Hi all,

I've found the solution for your future reference (Yeah me!)

For Minimal theme, you won't be able to find it in related-products.liquid or recommended-products.liquid...but rather, in theme.js!!

--

I don't encourage any change if it doesn't suit your need, because theme.js is not any liquid file and its language is tricky to me.

But I did find these lines of code:

  function ProductRecommendations(container) {
    this.$container = $(container);

    var baseUrl = this.$container.data('baseUrl');
    var productId = this.$container.data('productId');
    var recommendationsSectionUrl =
      baseUrl +
      '?section_id=product-recommendations&product_id=' +
      productId +
      '&limit=4';

 

In there, you can change into 5. You're welcome 🙂

So now I'm using Grid layout in Minimal theme for Books, because of their small thumbnails, in each of my product page I have 5 small recommended books underneath.

View solution in original post

Reply 1 (1)
tinooze
Excursionist
15 1 6

This is an accepted solution.

Hi all,

I've found the solution for your future reference (Yeah me!)

For Minimal theme, you won't be able to find it in related-products.liquid or recommended-products.liquid...but rather, in theme.js!!

--

I don't encourage any change if it doesn't suit your need, because theme.js is not any liquid file and its language is tricky to me.

But I did find these lines of code:

  function ProductRecommendations(container) {
    this.$container = $(container);

    var baseUrl = this.$container.data('baseUrl');
    var productId = this.$container.data('productId');
    var recommendationsSectionUrl =
      baseUrl +
      '?section_id=product-recommendations&product_id=' +
      productId +
      '&limit=4';

 

In there, you can change into 5. You're welcome 🙂

So now I'm using Grid layout in Minimal theme for Books, because of their small thumbnails, in each of my product page I have 5 small recommended books underneath.