how to remove product's prices on featured collection only when it is used on home page

Solved

how to remove product's prices on featured collection only when it is used on home page

Joryobk
Tourist
10 0 2

Hello, 

I need help removing the product price from the featured collection only in my front page. I tried several options but none was a full success. when I try to remove the price it will apply on all the pages.  I am using the Dawn theme. 

Screenshot 2023-10-03 at 11.29.16 AM.png

Accepted Solution (1)

Anshul_arora
Navigator
453 129 106

This is an accepted solution.

Hello @Joryobk ,

As per my understanding you are looking to hide product pricing in the Home Page.

You can implement this change by following below mentioned steps -:

1. Go to the Online Store, then Themes and click 'Customize' button https://prnt.sc/OG-yMQ3--56k

2. Next, On the left side, find the section named -> Featured collection and then click on it. https://prnt.sc/q-nsx4VJ-CG8

3. After clicking, Featured collection will provide some options https://prnt.sc/fX4XdRAuz0Yk  , scroll down at the end and click Custom CSS https://prnt.sc/5R98QuTPYRkj

4. Next , add the below mentioned code in this section as mentioned in screenshot https://prnt.sc/GJoxgZfpGWJN

.gradient .collection .price {
display: none;
}

5. Now, save the changes.

Output will look like this in Home page (product price will not visible) https://prnt.sc/TajLkSADhD2i  and in Product Listing/Collection page product price will visible https://prnt.sc/s2-bZv-RrHoL

I hope it helps.

Please let me know if you have any query.

Thank you.

Please remember to like and accept the solution to help other store owners.

For Shopify Design & Development | Custom Coding -Visit Here

View solution in original post

Replies 10 (10)

Beae_Cass
Shopify Partner
447 167 187

Hi @Joryobk ,

Could you please share your store URL, so that I can help you

Beae - The NextGen Page Builder


- Was my answer helpful? Please hit Like or Mark it as solution!
- Get in touch with us: App Store | Demo Template

ZestardTech
Shopify Partner
6139 1097 1473

Hello There,

 

1. In your Shopify Admin go to online store > themes > actions > edit code
2. Find Asset > base.css and paste this at the bottom of the file:

 

.gradient .collection .price{
display: none;
}

 

Want to modify or develop new app, Hire us.
If helpful then please Like and Accept Solution .
Email: support@zestard.com
Shopify Apps URL :- https://apps.shopify.com/partners/zestard-technologies
Custom Modifications Into Shopify Theme | Shopify Private App | SEO & Digital Marketing
Joryobk
Tourist
10 0 2

Thank you for your reply. The price removal code was applied to all the pages. Is there a way to only remove the price on the home page?

oscprofessional
Shopify Partner
16366 2440 3188

Hello @Joryobk 

Please provide your store URL so I can review it and provide a solution.

Hire us | Pass Core Web Vital | B2B Wholesale Experts | Claim Your Free Website Review |
Connect with Us: WhatsApp | Skype: oscprofessionals-87 | Email: pallavi@oscprofessionals.com |
Custom Shopify SolutionsPrivate Apps, Theme Customization & SEO | Digital Marketing |
OSCP Apps: Discount Suite | Wholesale App | Bundle & Upsell | Shipping Discount | and more...
Joryobk
Tourist
10 0 2

Obkworld.com

password: 1234

Anshul_arora
Navigator
453 129 106

This is an accepted solution.

Hello @Joryobk ,

As per my understanding you are looking to hide product pricing in the Home Page.

You can implement this change by following below mentioned steps -:

1. Go to the Online Store, then Themes and click 'Customize' button https://prnt.sc/OG-yMQ3--56k

2. Next, On the left side, find the section named -> Featured collection and then click on it. https://prnt.sc/q-nsx4VJ-CG8

3. After clicking, Featured collection will provide some options https://prnt.sc/fX4XdRAuz0Yk  , scroll down at the end and click Custom CSS https://prnt.sc/5R98QuTPYRkj

4. Next , add the below mentioned code in this section as mentioned in screenshot https://prnt.sc/GJoxgZfpGWJN

.gradient .collection .price {
display: none;
}

5. Now, save the changes.

Output will look like this in Home page (product price will not visible) https://prnt.sc/TajLkSADhD2i  and in Product Listing/Collection page product price will visible https://prnt.sc/s2-bZv-RrHoL

I hope it helps.

Please let me know if you have any query.

Thank you.

Please remember to like and accept the solution to help other store owners.

For Shopify Design & Development | Custom Coding -Visit Here
Joryobk
Tourist
10 0 2

Hi @Anshul_arora

 

Your explanation was amazing and very easy to apply. Thank you 

Anshul_arora
Navigator
453 129 106

Thank you.

Please remember to like and accept the solution to help other store owners.

For Shopify Design & Development | Custom Coding -Visit Here
uncloudedhair
Visitor
1 0 0

it didn't work for me

 

Lylefk
Excursionist
17 0 1

THANK YOU! Lots of older solutions don't work, but this one is super easy and works like a charm (Trade theme). Thank you!!!