Shopify themes, liquid, logos, and UX
We're moving the community! Starting July 7, the current community will be read-only for approx. 2 weeks. You can browse content, but posting will be temporarily unavailable. Learn more
Hi there,
we want to remove the "discounted price" for one item only on collection page.
Is there a way to do this? We still want customers to see it on product page though.
Please follow the instructions below.
NOTE: This will remove the sale badge (the red sale container text) and the sale price
1. From you Admin page, go to Products, then find the said product that you want to remove the compare price
2. Find the Compare-at price. Make sure it is zero
See image below as reference
Hi, thanks for that.
I fear it's slightly more complicated. We want to keep the "Compare at price" on product page level, BUT remove it from collection page for one specific product only. Do you know what I mean?
Yes, it is possible to remove the discounted price for a specific item only on the collection page while still displaying it on the product page. To achieve this, you can use a conditional statement in the collection template. Here's an example of how you can do it:
Open the collection template file in your theme editor. This file is typically named something like collection.liquid
or collection-template.liquid
.
Locate the section of code responsible for displaying the products in the collection. This section may include a loop that iterates over the products.
Within the loop, find the code that displays the discounted price. It may look something like this:
Wrap the code that displays the discounted price with a conditional statement. In the condition, check if the current product's handle or some other unique identifier matches the specific item you want to exclude. For example:
{% unless product.handle == 'specific-item-handle' %}
<span class="discounted-price">{{ product.price | money }}</span>
{% endunless %}
Hello @tomorrowgolf
You can try this code: it will be helpful to you
Go to the Online Store->Theme->Edit code->Assets->base.css>Add this code at the bottom.
.section-template--15538281087166__product-grid-padding .price-item.price-item--regular {
display: none;
}
If the solution is not helpful to you then Please provide your store URL and, if it is password protected, please share the password so I can review it and provide a solution.
And this would only remove the "compare at price" for one specific product on collection page?
It's only about this product: https://tomorrowgolf.com/products/tomorrow-golf-balls-single-pack-12-balls
Hello @tomorrowgolf
Do you want only for one item?
Yes, that's what I said in the description 😉
Hello @tomorrowgolf
You need to add a different custom class for that product price.
Hi @Tomorrowgolf,
You can try this code by following these steps:
Step 1: Go to Online Store->Theme->Edit code.
Step 2: Search file base.css
Step 3: Paste the below code at the bottom of the file -> Save
#shopify-section-template--15538281087166__product-grid [data-id="template--15538281087166__product-grid"] .card__information:has(>#title-template--15538281087166__product-grid-7522209595582) .price__sale s.price-item.price-item--regular{display:none}
Hope my solution works perfectly for you.
Cheers!
Oliver | PageFly
Please let me know if it works by giving it a Like or marking it as a solution!
PageFly - #1 Page Builder for Shopify merchants.
All features are available from Free plan. Live Chat Support is available 24/7.