Less featured collection rows on homepage of boundless theme

Logan_Nicole
New Member
2 0 0

I need my featured collections on my homepage to have a limited amougn of product rows instead of having the whole collection show. I tried changing it in collection liquid but it only changed the collection pages not on the homepage.

0 Likes
Katy
Shopify Staff
Shopify Staff
771 43 168

Hey, Logan!

Katy here from Shopify. I hope you are keeping well. 

This is a great question, and I can see how you might like to show certain products only within your featured collection. I have included some steps below to help you in setting this up.

If you are not overly familiar with working with code (or sometimes, even if you are!) I suggest to create a duplicate copy of your theme, and apply these here first. This allows you to have a backup at the ready. 

To make this change, it will require two steps and we are going to work with your:
featured-collection.liquid 

If you could then go to your admin > online store > themes > actions > edit code > sections > featured-collection.liquid.

In here, at the very bottom of the file you will need to add the following:

,
  {
    "type":      "range",
    "id":        "limit_products",
    "min":       1,
    "max":       50,
    "step":       1,
    "unit":       "prd",
    "label":     "Limit number of products",
    "default":   8
    }


Do take care to ensure that you add the first comma. Ideally this should be placed beside the closing curly bracket on the line just above where you will paste your code. 

Once in place, then if you could scroll back up and search for:

{% for product in collections[featured_collection].products %}

This should be around line 22. Here we will modify `for` loop by replacing it with

{% for product in collections[featured_collection].products limit: section.settings.limit_products %}

For example:

Once you have this set up, you can then adjust all of this from within your theme customizer directly- allowing you to decide how many products are shown per featured collection.

I hope this helps you out- do please feel free to let me know how you get on!

Thanks,

Katy

Please note: This account is no longer regularly monitored.
 - If you need assistance please do start a new topic (referencing an older topic/post if you find this helpful).
 - Thank you for your understanding. We hope you enjoy exploring the Community.
 - To learn more visit the Shopify Help Center or the Shopify Blog.

NicMuhl
Shopify Partner
5 0 0

Hi Katy. When I did this and clicked save I got an error massage saying Invalid JSON in tag 'schema'

What could the issue be? I attached screenshots. Thanks

0 Likes
SiC
New Member
1 0 0

I am not sure if you still need the answer, but i put it here anyway. I also need to limit the rows for Featured Collections on the front page. I followed Katy's direction for the most part, and also got the same error as yours. 

In order to fix the error, i needed to put the schema Katy provided inside the "settings": [ ] in stead of at the end of the liquid page.

 

-------

To make it easy, you could just simply replace your Schema part with the Schema below:

 

{% schema %}
{
  "name": {
    "de": "Featured Kategorie",
    "en": "Featured collection",
    "es": "Colección destacada",
    "fr": "Collection en vedette",
    "it": "Collezione in evidenza",
    "ja": "特集コレクション",
    "pt-BR": "Coleção em destaque"
  },
  "class": "index-section featured-collection-section",
  "settings": [
    {
      "type": "header",
      "content": {
        "de": "Kategorie",
        "en": "Collection",
        "es": "Colección",
        "fr": "Collection",
        "it": "Collezione",
        "ja": "コレクション",
        "pt-BR": "Coleção"
      }
    },
    {
      "type": "collection",
      "id": "home_featured_products",
      "label": {
        "de": "Kategorie",
        "en": "Collection",
        "es": "Colección",
        "fr": "Collection",
        "it": "Collezione",
        "ja": "コレクション",
        "pt-BR": "Coleção"
      }
    },
    {
      "type": "header",
      "content": {
        "de": "Foto",
        "en": "Image",
        "es": "Imagen",
        "fr": "Image",
        "it": "Immagine",
        "ja": "画像",
        "pt-BR": "Imagem"
      }
    },
    {
      "type": "select",
      "id": "product_image_type",
      "label": {
        "de": "Bildstil",
        "en": "Image style",
        "es": "Estilo de imagen",
        "fr": "Style d'image",
        "it": "Stile immagine",
        "ja": "画像スタイル",
        "pt-BR": "Estilo da imagem"
      },
      "options": [
        {
          "value": "portrait",
          "label": {
            "de": "Hoch/Quadrat",
            "en": "Tall/square",
            "es": "Alta/cuadrada",
            "fr": "Grand/carré",
            "it": "Verticale/quadrata",
            "ja": "縦長/正方形",
            "pt-BR": "Alto/quadrado"
          }
        },
        {
          "value": "landscape",
          "label": {
            "de": "Breit",
            "en": "Wide",
            "es": "Ancho",
            "fr": "Large",
            "it": "Orizzontale",
            "ja": "横長",
            "pt-BR": "Grande"
          }
        }
      ]
    },
    {
      "type": "select",
      "id": "product_image_size",
      "label": {
        "de": "Foto-Größe",
        "en": "Image size",
        "es": "Tamaño de la imagen",
        "fr": "Taille de l'image",
        "it": "Dimensione immagine",
        "ja": "画像のサイズ",
        "pt-BR": "Tamanho da imagem"
      },
      "default": "medium",
      "options": [
        {
          "value": "small",
          "label": {
            "de": "Klein",
            "en": "Small",
            "es": "Pequeña",
            "fr": "Petite",
            "it": "Small",
            "ja": "小",
            "pt-BR": "Pequeno"
          }
        },
        {
          "value": "medium",
          "label": {
            "de": "Mitte",
            "en": "Medium",
            "es": "Mediana",
            "fr": "Moyenne",
            "it": "Medium",
            "ja": "中",
            "pt-BR": "Médio"
          }
        },
        {
          "value": "large",
          "label": {
            "de": "Groß",
            "en": "Large",
            "es": "Grande",
            "fr": "Grande",
            "it": "Large",
            "ja": "大",
            "pt-BR": "Grande"
          }
        },
        {
          "value": "xlarge",
          "label": {
            "de": "Extra groß",
            "en": "Extra large",
            "es": "Extra grande",
            "fr": "Très grande",
            "it": "Extra large",
            "ja": "特大",
            "pt-BR": "Extra grande"
          }
        }
      ]
    },
    {
      "type": "checkbox",
      "id": "product_image_spacing",
      "label": {
        "de": "Bildabstand aktivieren",
        "en": "Enable image spacing",
        "es": "Habilitar espaciado de imagen",
        "fr": "Activer l'espacement des images",
        "it": "Abilita spaziatura immagini",
        "ja": "画像の間隔を有効にする",
        "pt-BR": "Ativar espaçamento de imagem"
      }
    },
    {
      "type": "checkbox",
      "id": "vendor_enable",
      "label": {
        "de": "Produktverkäufer anzeigen",
        "en": "Show product vendor",
        "es": "Mostrar proveedor del producto",
        "fr": "Afficher le distributeur du produit",
        "it": "Mostra fornitore prodotto",
        "ja": "商品の販売元を表示する",
        "pt-BR": "Exiba o fornecedor do produto"
      }
    },
{
    "type":      "range",
    "id":        "limit_products",
    "min":       1,
    "max":       50,
    "step":       1,
    "unit":       "prd",
    "label":     "Limit number of products",
    "default":   8
    }
 
  ],
  "presets": [
    {
      "name": {
        "de": "Featured Kategorie",
        "en": "Featured collection",
        "es": "Colección destacada",
        "fr": "Collection en vedette",
        "it": "Collezione in evidenza",
        "ja": "特集コレクション",
        "pt-BR": "Coleção em destaque"
      },
      "category": {
        "de": "Kategorie",
        "en": "Collection",
        "es": "Colección",
        "fr": "Collection",
        "it": "Collezione",
        "ja": "コレクション",
        "pt-BR": "Coleção"
      }
    }
  ]
 
 
}
{% endschema %}

 

0 Likes
brandonkickz
New Member
1 0 1

Hi, 

I put in the code and it worked but the only thing is that the "view more" button is not there. How do I add a "view more" button so they can click it after viewing 9 items?

Siva_P
Tourist
5 0 0

As well can I add limit of rows in schema and how? I need 4(prod) in each row n need feasiblity to change rows number 

0 Likes
Triggerbug
New Member
2 0 0

I copied this exactly and it didn't work, still seeing alot of products.

0 Likes
naturalme
New Member
2 0 0

You found any solution?

0 Likes