A space to discuss online store customization, theme development, and Liquid templating.
Hello. I am using Dawn Theme in the online store. While trying the app for discount tags, I accidentally deleted the app I liked. I can't find the app and the discount I entered to try is still in the online store. Can I delete the discount tag and find the app causing it?
Solved! Go to the solution
This is an accepted solution.
You can change it. It uses the Accent-2 color in Theme Settings. Beyond that, you need to add bit of CSS code and add the css identifier to badge. I have done this already myself. I use the sale badge as a way show Discount Percentage between Compare and Price.
You will need to edit the code for the Dawn template.
Look in Card-Product.liquid under Snippets for this code
{%- if card_product.available == false -%}
<span class="badge badge--bottom-left color-{{ settings.sold_out_badge_color_scheme }}">{{ 'products.product.sold_out' | t }}</span>
{%- elsif card_product.compare_at_price > card_product.price and card_product.available -%}
<span class="badge badge--bottom-left color-{{ settings.sale_badge_color_scheme }}">
{{ 'products.product.on_sale' | t }}</span>
{%- endif -%}
And add {% comment %} to beginning and at end{% endcomment %}. You can remove these later if you decide you want it back.
{% comment %}
{%- if card_product.available == false -%}
<span class="badge badge--bottom-left color-{{ settings.sold_out_badge_color_scheme }}">{{ 'products.product.sold_out' | t }}</span>
{%- elsif card_product.compare_at_price > card_product.price and card_product.available -%}
<span class="badge badge--bottom-left color-{{ settings.sale_badge_color_scheme }}">
{{ 'products.product.on_sale' | t }}</span>
{%- endif -%}
{% endcomment %}
Next step is goto price.liquid under snippets;
{%- if show_badges -%}
<span class="badge price__badge-sale color-{{ settings.sale_badge_color_scheme }}">
{{ 'products.product.on_sale' | t }}
</span>
<span class="badge price__badge-sold-out color-{{ settings.sold_out_badge_color_scheme }}">
{{ 'products.product.sold_out' | t }}
</span>
And add {% comment %} to beginning and at end{% endcomment %}.
{% comment %}
{%- if show_badges -%}
<span class="badge price__badge-sale color-{{ settings.sale_badge_color_scheme }}">
{{ 'products.product.on_sale' | t }}
</span>
<span class="badge price__badge-sold-out color-{{ settings.sold_out_badge_color_scheme }}">
{{ 'products.product.sold_out' | t }}
</span>
{%- endif -%}
{% endcomment %}
Furthermore, Sale Tag is default behavior of Shopify when you use Compare Price and Price fields together. Whenever the Compare Price is Greater, Shopify treats Price as a Sale Price.
Thank you very much.
Can I change color Sale tags?
This is an accepted solution.
You can change it. It uses the Accent-2 color in Theme Settings. Beyond that, you need to add bit of CSS code and add the css identifier to badge. I have done this already myself. I use the sale badge as a way show Discount Percentage between Compare and Price.
Hi AlohaAkahai
I did apply this code and is working perfectly. I have an issue with the SOLD OUT badge, it is removed too. How can I add it back as it is important to show sold out in the grid. Thanks
Hi! I need help with this too- I just want the sale badge removed while leaving the cross out price viewable and all the CSS I’ve found deletes the sold out badge too- anyone know how to just delete the sale badge from main page+ collection pages??
If the sold out badge is gone then you don't have badges set to be shown in preferences.
The code {%- if show_badges -%} checks if you have it turned off or on.
Where do I check this I removed my sales tag and it removed my sold out tag on all my products how do I bring it back to my collections page?