How to hide the sold out tag

[Lajos]

Hi can you help me please?

I need to hide the sold-out tag from my product catalog. I tried all the advice but it doesn't work for my theme.

My url: https://www.energetikon.com/collections/all

Theme: Colorblock

Thanks for the answer

Best regards..

[ThomKnepper]

Hi,

In your theme code go to the 'card-product.liquid' and find this code:

            <span
              id="Badge-{{ section_id }}-{{ card_product.id }}"
              class="badge badge--bottom-left color-{{ settings.sold_out_badge_color_scheme }}"
            >
              {{- 'products.product.sold_out' | t -}}
            </span>

All you have to is create a simple template for that collection. Then you can create the following code:

{% if collection.template_suffix != 'your name'%}

            <span
              id="Badge-{{ section_id }}-{{ card_product.id }}"
              class="badge badge--bottom-left color-{{ settings.sold_out_badge_color_scheme }}"
            >
              {{- 'products.product.sold_out' | t -}}
            </span>
{% endif %}

[Moeed · Accepted solution]

Hey @Lajos 

Follow these Steps:

1) Go to Online Store
2) Edit Code
3) Find theme.liquid file
4) Add the following code in the bottom of the file above </body> tag.

<style>
.card__badge.bottom.left {
    display: none !important;
}
</style>

RESULT:

If I managed to help you then, don't forget to Like it and Mark it as Solution!

Best Regards,
Moeed

[ThomKnepper]

A couple of things that are not super ideal about the solution you're proposing.

1. You should NOT add custom css with the !important tag in the theme file. If you want to edit some CSS for the whole theme, just use the customizer and the 'Custom CSS' option.
2. Also, simply not displaying this block is not the same as not loading it at all. On top of that, this person might want to show the sold out badge on different pages. 

This way you're doomed to have issues in the future.

[Lajos]

It works! Thank you very much...