Solved

How to hide the sold out tag

Lajos
New Member
6 0 0

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..

Accepted Solution (1)

Moeed
Shopify Partner
3794 958 1189

This is an 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:

Moeed_0-1715685084658.png

 

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

 

Best Regards,
Moeed

Need a Shopify developer? Chat on WhatsApp


- For Shopify Design Changes | Shopify Custom Coding | Custom Modifications
- Your Coffee Tip and my code, A perfect blend. ❤️

View solution in original post

Replies 4 (4)

ThomKnepper
Shopify Partner
188 30 69

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 %}
Best wishes,
Thom Knepper - Athom.Agency
- Was my reply helpful? Please Like to let me know!
- Was your question answered? Awesome! Please Mark it as an Accepted Solution

Moeed
Shopify Partner
3794 958 1189

This is an 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:

Moeed_0-1715685084658.png

 

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

 

Best Regards,
Moeed

Need a Shopify developer? Chat on WhatsApp


- For Shopify Design Changes | Shopify Custom Coding | Custom Modifications
- Your Coffee Tip and my code, A perfect blend. ❤️
ThomKnepper
Shopify Partner
188 30 69

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.

Best wishes,
Thom Knepper - Athom.Agency
- Was my reply helpful? Please Like to let me know!
- Was your question answered? Awesome! Please Mark it as an Accepted Solution
Lajos
New Member
6 0 0

It works! Thank you very much...