Impact theme remove sale badge collection

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

2

Hi @Derraa

Try adding the below code to your “theme.liquid” file

.collection .product-card__badge-list .badge--on-sale { display: none; }

Let know it it helps or not.

3

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

4

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;
}