Shopify themes, liquid, logos, and UX
Hello,
How do I remove the price from the collections page?
URL is https://staysharp.global/
Thanks in advance
@BethLawton10
You can use css property display none to remove the price from collection page.
Or you can remove the price from liquid code.
Do you want to remove the price from all collections, or are there some collections you want the price removed from while keeping prices on some?
You can edit your theme code to change that collection template and remove the pricing.
I would do this by creating a new collection template, and removing the code that shows the pricing. This way you can have two collection templates to choose from: one without price showing, and the other with price showing.
Hope that helps!
I had this same question and I did what you said, I created another template to remove the pricing from just a certain collection but what code do I put in the json of that collection to remove the price tags from all products? I would also like to remove the "sold out" tags from this same collection?
Hey Artess - I was wondering if you ever found a solution? I'm in the same predicament with creating my template for collections that doesn't show the price.
Hi @BethLawton10 ,
Do you mean to remove this table price from the collection page?
Please confirm again. Thanks you
Hello @AvadaCommerce
I mean the prices underneath the products on the homepage. Sorry, my original message wasn't clear.
Any ideas?
Thank you
Hello @BethLawton10 !
So I went ahead and wrote a bit off CSS that will have your desired effect:
{% if template.name == "index" %}
{%style%}
.grid-product__price {
display: none;
}
{%endstyle%}
{% endif %}
(Do this on a copy theme!) Go into your store admin, then go to Online Store > Themes > Actions (on your live theme) > Edit Code. Then search and find the file named 'theme.liquid'. Add that code to either the very top or bottom of that file, then hit save. That should work, let me know if it doesn't!
Another way to do it would be to use the app Easy Edits: https://apps.shopify.com/easy-edits
If you use the app, you can just click on the prices on the home page and set the display to none (it gives you a click and change editor for your store). You can always make your edits, and then delete the app and keep the edits, without paying.
(Disclaimer: I'm the founder/developer behind the app)
Hopefully, that helped out, let me know if it did or if I can answer anything else!
@mt686 the code didn't work unfortunately. I can't use the app as our legal team have to approve any apps we use, so I'd have to go through the due diligence process.
Thank you anyway 🙂
Give this a try:
{% style %}
.grid-product__price {
display: none;
}
{% endstyle %}
Follow the same instructions to add it that I wrote before, and make sure to add it to a copy of your theme and look it over before publishing. Here's a screenshot after adding that code to your site:
Hi @BethLawton10 ,
You can follow the instruction below:
1. Go to Online Store->Theme->Edit code
2. Asset->/theme.css->paste below code at the bottom of the file:
.grid-product__price {
display: none !important;
}
If you feel like my answer is helpful, please mark it as a SOLUTION. Let me know if you have any further questions.
Hi, how can I remove the product pricing from my collection page:
Just this collection page:
https://vannivrystaat.co.za/collections/biltong we use DEBUT as theme.
Hello, I just tried this and it didn't work for me.
I tried the below {% style %} .grid-product__price { display: none; } {% endstyle %} and it worked! Thanks!
Hi!
where did you paste this content? Is it in theme.liquid or in the collection.json?
thanks
Wouldn't the code need to be redone anytime there is an update to the theme? Thanks, Mt686. What a cool editing app, BTW.
Hi I I'm looking to remove the prices in only one collection, as I'm not sure if I would be capable of inserting code, I have downloaded your app, but for some reason it's not working? it says
An error occurred in the application and your page could not be served. If you are the application owner, check your logs for details. You can do this from the Heroku CLI with the command
heroku logs --tail
"Remove prices in collections tab"
I had the same concern, and managed to figure out how to do this in just a few steps. I want to share it here in case anyone else needs it!
(I'm using the default DAWN theme, although the idea should work in any Shopify theme)
1- Go to your store code and look for the following file called: price.liquid
2- Add the following code after the container: <div class="price__container">
{% if collection.url contains '/collections' %}
{%- assign show_price = false -%}
{% else %}
{%- assign show_price = true -%}
{% endif %}
{% if show_price %}
3- Remember to close the condition {% if show_price %} at the end of the code with {% endif %}. Line 93 in my case. The code will look something like this:
4- Save the file. In the collections tab you will no longer see the prices on the products.
I hope it has helped you!
Thank you very much it worked! I tried all the other code but it didn't work for me, except for yours. The prices in my collections are hidden now thank you again!
This looks like a great solution, but I don't seem to have <price.liquid> in my code? Using the impulse theme....
I have tried to download that template to find what the file is called in that specific topic, but since it is paid, I had to search the internet and there is no information about it. I would recommend asking an expert on the subject, or requesting support to find out what name they use for price.liquid
User | RANK |
---|---|
207 | |
166 | |
77 | |
56 | |
54 |
Make the shift from discounts to donations, and witness your business not only thrive fina...
By Holly Dec 4, 2023On our Shopify Expert Marketplace, you can find many trusted third party developers and fr...
By Arno Nov 27, 2023You've downloaded the Search & Discovery app from the Shopify App store, and as you're ...
By Skye Nov 8, 2023