Change font/appearance of Product Price in collections/homepage (Brooklyn Theme)

Solved
ClasOhl
Excursionist
12 1 1
I'm trying to change the font/font size of my prices, as well as removing the dash sign "-" that appears between the product titles and the prices. I'd also like to figure out how to make the "compare at" price appear in collections/homepage/product list (as it is now, it's only visible on the product page itself) I'm pretty new to shopify and this is my first store, so I may be missing something obvious - but any help with this is much appreciated. :) Thank you
Accepted Solutions (3)

Accepted Solutions
oscprofessional
Shopify Partner
9201 1563 1928

This is an accepted solution.

Hello   

 

1) To remove  "-"  find  <span class="long-dash">—</span>  in product-grid-item.liquid  and onboarding-featured-products.liquid files and then delete the section from here.

2) In brooklyn theme compare at price is already present, at the top of the image product image on home-page its shown in form of tag  ie. SAVE Rs.5

brooklyn_save_tag.jpgcomapre_price.jpg

If helpful then please Like and Accept Solution. Want to Speed up your Shopify Website Guranteed result Whats app
| Hire us
| Expert Site Speed Optimization | Performance Site Audit | Shopify Private App | Custom Theme Development & Modifications any Shopify Theme | Shopify SEO | Digital Marketing
For Quick Chat | Email: pallavi@oscprofessionals.com | Skype : oscprofessionals-87

View solution in original post

oscprofessional
Shopify Partner
9201 1563 1928

This is an accepted solution.

Hello 

.grid-product__price-wrap .custom-price{
font-size:10px;
}

Add css in theme.scss.liquid  at the end of the file.

If helpful then please Like and Accept Solution. Want to Speed up your Shopify Website Guranteed result Whats app
| Hire us
| Expert Site Speed Optimization | Performance Site Audit | Shopify Private App | Custom Theme Development & Modifications any Shopify Theme | Shopify SEO | Digital Marketing
For Quick Chat | Email: pallavi@oscprofessionals.com | Skype : oscprofessionals-87

View solution in original post

Replies 7 (7)
oscprofessional
Shopify Partner
9201 1563 1928

This is an accepted solution.

Hello   

 

1) To remove  "-"  find  <span class="long-dash">—</span>  in product-grid-item.liquid  and onboarding-featured-products.liquid files and then delete the section from here.

2) In brooklyn theme compare at price is already present, at the top of the image product image on home-page its shown in form of tag  ie. SAVE Rs.5

brooklyn_save_tag.jpgcomapre_price.jpg

If helpful then please Like and Accept Solution. Want to Speed up your Shopify Website Guranteed result Whats app
| Hire us
| Expert Site Speed Optimization | Performance Site Audit | Shopify Private App | Custom Theme Development & Modifications any Shopify Theme | Shopify SEO | Digital Marketing
For Quick Chat | Email: pallavi@oscprofessionals.com | Skype : oscprofessionals-87

View solution in original post

ClasOhl
Excursionist
12 1 1

Thank you for the explanation Pallavi, and please excuse my late response!

Any ideas on how I can edit the size of the price, as it appears next to the product title?

Best regards
Clas

oscprofessional
Shopify Partner
9201 1563 1928

This is an accepted solution.

Hello 

.grid-product__price-wrap .custom-price{
font-size:10px;
}

Add css in theme.scss.liquid  at the end of the file.

If helpful then please Like and Accept Solution. Want to Speed up your Shopify Website Guranteed result Whats app
| Hire us
| Expert Site Speed Optimization | Performance Site Audit | Shopify Private App | Custom Theme Development & Modifications any Shopify Theme | Shopify SEO | Digital Marketing
For Quick Chat | Email: pallavi@oscprofessionals.com | Skype : oscprofessionals-87

View solution in original post

ClasOhl
Excursionist
12 1 1
Brilliant! Thank you so much :) Best regards, Clas
BSPL_Team
Tourist
11 0 1

Hey, can you tell me how do I change the  font for the same in Minimal Theme?