All things Shopify and commerce
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.
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.
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.
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;
}
Discover how to increase the efficiency of commerce operations with Shopify Academy's l...
By Jacqui Mar 26, 2025Shopify and our financial partners regularly review and update verification requiremen...
By Jacqui Mar 14, 2025Unlock the potential of marketing on your business growth with Shopify Academy's late...
By Shopify Mar 12, 2025