All things Shopify and commerce
Hello, I have a collection where I only display 3 items, however I am trying to randomize the order of the items. Shuffle isn't working. How can i display the items in a random order ?
{% capture listItems %}
{% paginate collections.all.products by 999 %}
{%- assign item_count = 0 -%}
{%- for item in collections.all.products -%}
{%- if item.title != 'Chain' and item_count < 3 -%}
<div role="listitem" class="large-collection-item w-dyn-item">
<a href="{{ item.url }}" class="product-card-copy-2 w-inline-block">
<div class="card-image-wrapper">
<div class="card-img extra-large">
<div data-w-id="0462e63a-69a8-dbd6-6071-61d7bacebf48" class="background-product">
<div class="img-card-one one" style="background-image: url('{{ item.images[0] | img_url: 'master' }}')" data-commerce-type="variation-image"></div>
<div class="img-card-one two" style="background-image: url('{{ item.images[1] | img_url: 'master' }}')"></div>
</div>
</div>
</div>
<div class="card-info">
<div id="w-node-_0462e63a-69a8-dbd6-6071-61d7bacebf4f-51ad9f5b" class="product-card-top">
<div class="product-card-info">
<div class="product-tags">
{%- if item.metafields.udesly['discount-percentage'] -%}
<div class="discount-label">
<img src="{{ 'tag-filled-red24x242x.svg' | asset_url }}" loading="lazy" id="w-node-_0462e63a-69a8-dbd6-6071-61d7bacebf56-51ad9f5b" alt="" class="tag-icon">
<div class="label-text-2 discount">{{ item.metafields.udesly['discount-percentage'] }}</div>
</div>
{%- endif -%}
</div>
<div class="stacked-product-title">
<h3 class="product-title">{{ item.title }}</h3>
<div class="subtitle small">{{ item.metafields.udesly['category-text'] }}</div>
</div>
</div>
<div class="dynamic-price">
<div data-commerce-type="variation-price" class="price-text">{{ item.price | money_with_currency }}</div>
<div class="discount-text" data-commerce-type="variation-compare_at_price">{{ item.selected_or_first_available_variant.compare_at_price | money_with_currency }}</div>
</div>
</div>
</div>
</a>
</div>
{%- assign item_count = item_count | plus: 1 -%}
{%- endif -%}
{%- endfor -%}
{% endpaginate %}
{% endcapture %}
{% assign items_length = listItems | strip | size %}
<div id="w-node-_5d10c2e1-3c53-7f31-ede3-90a3b8a681ed-51ad9f5b" class="w-dyn-list" udy-collection="product">
{%- unless items_length == 0 -%}<div role="list" class="product-grid w-dyn-items">
{{ listItems }}
</div>{%- endunless -%}
{%- if items_length == 0 -%}<div class="w-dyn-empty">
<div>No items found.</div>
</div>{%- endif -%}
</div>
Learn what's possible with customizing Shopify Checkout beyond what's available out of...
By Shopify Feb 19, 20252m ago Learn the essential skills to navigate the Shopify admin with confidence. T...
By Shopify Feb 12, 2025Learn how to expand your operations internationally with Shopify Academy’s learning path...
By Shopify Feb 4, 2025