Impact theme remove sale badge collection

Derraa
Tourist
6 0 1

Hello, how can I remove the sales badge on the collection page in the Impact theme?

The sale badge should only be visible on the product page.

Replies 3 (3)

JasmeetVT14313
Shopify Partner
134 32 37

Hi @Derraa 

Try adding the below code to your "theme.liquid" file

<style>
.collection .product-card__badge-list .badge--on-sale {
display: none;
}
</style>

Let know it it helps or not.

- Helpful? Please hit Like and mark it as a solution
- VTN Power Wishlist ultimate solution for effortless wishlist management. Free plan available
- Feel free to contact me at jasmeet.kaur@vtnetzwelt.com

azamgill
Shopify Partner
323 47 73

@Derraa 

 

Go to Theme Editor:

From your Shopify admin, navigate to Online Store > Themes.

Find your Impact theme and click on Customize.

Edit Theme CSS:

In the theme editor, click on Theme actions at the bottom of the sidebar.

Select Edit code.

Locate the CSS File:

Find a CSS file where you can add custom styles. This could be base.css, theme.scss.liquid, or similarly named file under the Assets folder.

Add Custom CSS:

At the bottom of the chosen CSS file, add the following CSS code to hide the sales badge on collection pages but keep it on product pages:

 

.collection-page .sale-badge {
  display: none;
}
​

 

If the .collection-page class does not accurately target the collection pages in your theme, you might need to inspect the HTML structure of your collection page to find the correct class or ID that uniquely identifies collection pages. Adjust .collection-page in the CSS snippet above with the correct selector.

Azam Gill
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution
- Encourage me ❤️

Come and visit us at Wbify

BrainStation23
Shopify Partner
262 43 41

Hi @Derraa 
You can try this flowing step to achieve your result

Go to online store -> Click edit code-> go-to theme.css file then use bellow code 

.collection .product-card__badge-list  {
display: none !important;
}



Brain Station 23 PLC
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution
Email: js.team@brainstation-23.com