Jak zařadit vyprodané produkty na konec kolekce na Shopify zdarma 🔚
Jan Němec, Co-Founder, UX & Front-end Engineer

Pokud máte produkty, které jsou momentálně vyprodané, může být výhodné zobrazit je na konci seznamu produktů v kolekci. Tímto způsobem zajistíte, že zákazníci uvidí nejprve dostupné položky a až poté produkty, které nejsou skladem. V tomto článku vám ukážu, jak toho jednoduše dosáhnout pomocí úpravy kódu v šabloně kolekcí na Shopify.
Proč zařadit vyprodané produkty na konec? 🤔
Zákazníci často chtějí vidět dostupné produkty a rychle se rozhodnout, co si mohou koupit. Vyprodané produkty na začátku seznamu mohou být frustrující a zdržující. Pokud je produkt vyprodaný, stále může být důležité ho zobrazit, ale neměl by být prioritou. Proto je vhodné umístit vyprodané položky na konec seznamu.
Jaké jsou vaše možnosti?
- Použití aplikací z App Store 💰 Existují aplikace na Shopify App Store, které umožňují řazení produktů podle dostupnosti bez nutnosti zásahu do kódu šablony. Většina z nich je však placená a vytváří řadu nových manuálních kolekcí ve vašem adminu, což může být postupem času velmi nepřehledné a méně spolehlivé.
- Úprava šablony 👨💻 Spolehlivější variantou je úprava vaší šablony. V našem návodu vám ukážeme, jak na to. Tento přístup je rychlejší, efektivnější a ušetří vám měsíční výdaje za placené aplikace.
Jak na úpravu šablony zdarma?
- Zkopírujte kód, který je uveden níže 👇🏻
- Otevřete šablonu vaší kolekce, často bývá pojmenována například jako collection.liquid, main-collection.liquid nebo main-collection-product-grid.liquid.
- Najděte místo, kde se iteruje přes produkty kolekce, tento kód v naprosté většině začíná tímto:
{% for product in collection.products %}
- Zaměňte tento kód novým, uložte soubor a otestujte.
{% assign available_products = collection.products | where: 'available' %}
{% assign out_of_stock_products = collection.products | where: 'available', false %}
{% assign products = available_products | concat: out_of_stock_products %}
{%- for product in products limit: section.settings.products_count -%}
<!-- Váš kód pro zobrazení produktů -->
{%- endfor -%}
Tento kód rozdělí produkty na dostupné a vyprodané a poté je znovu spojí do jednoho seznamu. Vyprodané produkty se zobrazí až po těch, které jsou skladem.
Hotovo! 🎉
Tato úprava vám pomůže udržet kolekce přehledné a uživatelsky přívětivé. Zákazníci budou moci snadněji procházet dostupné produkty, aniž by byli rozptylováni vyprodaným zbožím.
Pokud chcete zajistit, aby se vyprodané produkty v kolekcích vůbec nezobrazovaly, máme pro vás připravený i tento podrobný návod. V článku Jak kompletně skrýt vyprodané produkty v kolekcích se dozvíte, jak tuto úpravu provést stejně tak snadno a rychle pomocí jednoduché úpravy v šabloně.