How to display products in an alternating order by type in a Shopify Collection

[Eddie79]

Hello there!

I have created a collection in Shopify called “Gifts” that consists of three different product types: “bags”, “wallets”, and “hats”. Each product type has 100 products, so the Gifts collection is showing a total of 300 products. However, the products are not displayed in the order that I want.

Here is what I want to achieve:

Display products mixed in an alternating order by product type (2 of each type per iteration) for example: first two bags, then two wallets, then two hats, and so on until completing the 300 products.

My current code is:

{%- for product in collection.products -%}
{%- render ‘product-item’, product: product, collection: collection, block: block, sizes_attribute: sizes_attribute, reveal: settings.stagger_products_apparition -%}
{%- endfor -%}

Thanks!

[Dan-From-Ryviu]

You must manually sort products from your Shopify admin > Collections to make products appear as you want.

[Eddie79]

We have thousands of products and those collections are updating frequently, so we are looking for a automatic way to do it.