Is there a code I can use to push out-of-stock or sold-out items to the bottom for Simple theme?

[VintageWares]

Hi, all! I'm guessing I'm not the first to ask this question. I'm currently using Shopify's free "simple" theme and was wondering if there was a code I could add/insert in the liquid theme (perhaps in liquid collections?) to automatically push my "out of stock" or "sold out" items to the bottom, so they're not mixed in with available products. I'd prefer not to use an App, as paying monthly seems cost prohibitive, since I have so many unique/individual items (versus a smaller selection of items). And I don't want to "delete" my sold-out items, as I'd like potential buyers to see our past sold-out listings.

I'm somewhat new to Shopify and any help/advice would be much appreciated!

Kindest,

Lilly~

[KetanKumar]

@VintageWares 

Sorry you are facing this issue, it would be my pleasure to help you.

Welcome to the Shopify community!😊
Thanks for your good question.

Please share your site URL,
I will check out the issue and provide you a solution here.

may do you have like this please try it 

<div id="variant-inventory">
{% if product.variants.first.inventory_management == "shopify" %}
{% if product.variants.first.inventory_quantity > 0 %}
We currently have {{ product.variants.first.inventory_quantity }} in stock.
{% else %}
The product is out of stock
{% endif %}
{% else %}
This product is available
{% endif %}
</div>

[zimousdigi]

Hi,

please check our app Nada - https://apps.shopify.com/nada-sort-hide-out-of-stock

The app is automatically sorting collections in real-time, so the sold-out products are always at the end of the collection and back when in stock again. You can try it for free to check that it really works smoothly 😉

[VintageWares]

Hi!

Where would I copy and paste this code? Which liquid section?

My website/URL is: 

https://southernvintagewares.com/

Thanks in advance!

Lilly~

[KetanKumar]

@VintageWares 

yes please add this product page above add to cart button 

[VintageWares]

Hi Ketan!

Thank you for the quick response! So to confirm, I should copy/paste the code you provided directly above the addToCart? Again, I'm using the free "Simple" theme. This is what my product template theme code currently looks like:

<script>
// Override default values of shop.strings for each template.
// Alternate product templates can change values of
// add to cart button, sold out, and unavailable states here.
window.productStrings = {
addToCart: {{ 'products.product.add_to_cart' | t | json }},
soldOut: {{ 'products.product.sold_out' | t | json }},
unavailable: {{ 'products.product.unavailable' | t | json }}
}
</script>

Kindest,
Lilly~

[KetanKumar]

@VintageWares 

Yes, please 

[VintageWares]

Hi Ketan,

It didn't work. I added the code you provided directly above the "add to cart" (so I inserted your code just below the "window.product strings" line and just above the "add to cart" line).  And it didn't work. My sold out products are still mixed in with my available products.

I'm looking for a code that will automatically push my sold out items to the very back of my listings (but still be visible even though they're sold out). I want my sold out products to automatically be pushed to the bottom or back of my listings, so my current/available products aren't mixed in with "sold out" items.

Do you have any other suggestions??

Kindest,

Leah

[KetanKumar]

@VintageWares 

oh sorry do you mean all sold out iteam show to bottom? if yes so sorry its code this relevant also its not possible this 

[VintageWares]

 Yes,  that's exactly what I mean. All "sold out" items get automatically pushed to the back of each of my categories, so the sold outs are mixed in with the available products. Is there a code to do this?

Lilly~

[KetanKumar]

@VintageWares 

sorry its not possible 

[sayanthan71]

<div class="product-list product-list--collection {% if has_filters %}product-list--with-sidebar{% endif %}">
{%- for product in collection.products -%}
{%- render 'product-item', product: product, list: show_as_list, grid_classes: grid_classes -%}
{%- endfor -%}
</div>

{%- render 'pagination', paginate: paginate -%}
{%- endif -%}
<script type="application/json" data-collection-products-count>
{
"productsCount": "{{ 'collection.general.products_count' | t: count: collection.products_count }}",
"showingCount": "{{ 'collection.general.showing_count' | t: offset: offset, page_size: page_size, count: paginate.items }}"
}
</script>
</div>
</div>
{%- endif -%}
</div>
</div>
{%- endpaginate -%}

my collection liquid code update sold item last page bottom in the list please🙏

[myfriendmonster]

I know this is a really old thread, but I was looking for the same thing for a long time, and finally found a free app! It is called Collection Merchandiser. Hope this helps (if you haven't found something in the meantime).

[KetanKumar]

@myfriendmonster 

great thanks for update