Solved

Debut Theme - Hide Price on Collection Page

McKvrSports
Tourist
18 0 2

Hi,

 

Really hoping someone can help out with this as I'm getting no answers online on how to do this and I am having no success on my end.

 

I have set collections that I need to hide the price on, these are to be used as product enquiry pages, I have managed to successfully duplicate and edit the code on the Product Theme Template for the products going into these collections to remove the Price, Add to Cart & Buy Now button and replaced it with an enquiry button, works great! 

I have managed to duplicate the Collection Theme Template so I can turn this on and off ( Similar to the Product Theme Template I created earlier ) but now I am at a dead end where I cannot seem to alter the code to remove the price from the collection front end.

 

Not sure what I'm doing wrong or if there is an easy solution for this, is there anyone that can help with this as this is the last piece of the puzzle for what I need.

 

Using 3rd Party apps are not an option (Currently using them and it is killing our site speed which is why i'm trying to go down this route) 

 

Here's a link to the page where the duplicated Collection Theme Template is in use, prices on the collection page still visible but when you click into the product you'll see i've managed to remove it. 

 

https://www.mckeeverteamwear.com/collections/hide-price-test-product 

 

Any help at all would be greatly appreciated! 

Accepted Solution (1)
PageFly-Richard
Shopify Partner
4206 951 1599

This is an accepted solution.

Hi @McKvrSports ,

 

This is Richard from PageFly - Landing page builder, I’d like to suggest this idea:
Step 1: Go to Online Store->Theme->Edit code
Step 2: Asset->/theme.css->paste below code before </body>:

 

#shopify-section-Hide-Price .price {
    display: none !important;
}

Step 3: Select template hide-price (that you have created) for the collection that you want to hide the price.
Ex: https://www.mckeeverteamwear.com/collections/hide-price-test-product -> This collection is currently using the hide-price template

I hope it would help you
Best regards,

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

View solution in original post

Replies 10 (10)

Moeed
Shopify Partner
3689 930 1161

Hey @McKvrSports 
Follow these steps

1) Go to Online Store
2) Edit Code
3) Find theme.liquid file
4) Add the following code in the bottom of the file above </body>

<style>
.template-collection dl.price.price--listing {
    display: none !important;
}
</style>


This code will only hide prices from collections only.

Need a Shopify developer? Chat on WhatsApp


- For Shopify Design Changes | Shopify Custom Coding | Custom Modifications
- Your Coffee Tip and my code, A perfect blend. ❤️
McKvrSports
Tourist
18 0 2

Hi Moeed,

 

Thanks for the response,

 

Will this hide the prices from all collections on the site or only specific ones I want to hide the prices from?

I require pricing to be visible on the majority of collections we use but I need to hide them on specific collections.

 

Thanks

Moeed
Shopify Partner
3689 930 1161

Can you please share links of those collection where you wanna display the prices so that I can tell you the code accordingly

Need a Shopify developer? Chat on WhatsApp


- For Shopify Design Changes | Shopify Custom Coding | Custom Modifications
- Your Coffee Tip and my code, A perfect blend. ❤️
McKvrSports
Tourist
18 0 2

Hi Moeed, 

 

There are collections created every day which require prices both on the collection and the product to be visible.

 

There will be " Static " Collections that will never need to display prices on either the products within the collection and the collection itself.

 

Here's an example of a collection where prices are required throughout: 

https://www.mckeeverteamwear.com/collections/eire-og-10324

 

Here's an example of a collection where prices will not be required at all:

https://www.mckeeverteamwear.com/collections/on-field

 

 

 

PageFly-Richard
Shopify Partner
4206 951 1599

This is an accepted solution.

Hi @McKvrSports ,

 

This is Richard from PageFly - Landing page builder, I’d like to suggest this idea:
Step 1: Go to Online Store->Theme->Edit code
Step 2: Asset->/theme.css->paste below code before </body>:

 

#shopify-section-Hide-Price .price {
    display: none !important;
}

Step 3: Select template hide-price (that you have created) for the collection that you want to hide the price.
Ex: https://www.mckeeverteamwear.com/collections/hide-price-test-product -> This collection is currently using the hide-price template

I hope it would help you
Best regards,

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

McKvrSports
Tourist
18 0 2

Hi Richard,

 

Thanks for this, worked perfectly! 

PageFly-Richard
Shopify Partner
4206 951 1599

Hi @McKvrSports 

 

Great! I'm glad that I can help.😊

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.

retroradiofarm
New Member
5 0 0

Doesn't work for me. I followed Moeed instructions and Page-Fly instructions. Not working

retroradiofarm
New Member
5 0 0

I do not see a theme.css in Assets. I only see </> theme.js and </> theme.scss.liquid

retroradiofarm
New Member
5 0 0

I do not see a theme.css in Assets. I only see theme.js and theme.scss.liquid