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

How to change text color on sale badge

Solved

How to change text color on sale badge

Luminora
Tourist
8 0 6

Hi,
Im fairly new to shopify. I have black text color, as my background is white. Ive managed to make the background color of the sale badge a different color, that matches the vibe. But i cant figure out how to change the black text color on my sale logo to white. Can anyone help?

Accepted Solution (1)

PageFly-Amelia
Shopify Partner
626 165 238

This is an accepted solution.

Hi @Luminora 

This is Amelia from PageFly - Landing Page Builder App

 

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 bottom of the file -> Save

 

.price__badge-sale {

    color: white !important;

}

 

Hope that my solution works for you.

Best regards,

Amelia | PageFly

Please let me know if it works by giving it a Like or marking it as a solution!


➜ Optimize your Shopify store with PageFly Page Builder (Free plan available) 
➜ Weekly updated Shopify tutorials on YouTube 


All features are available from Free plan. Live Chat Support is available 24/7.

View solution in original post

Replies 6 (6)

BSS-TekLabs
Shopify Partner
2401 695 836

Hello @Luminora .
Our team is ready to help you.
Please share your website address and access password (if necessary) so that we can check and assist you.

If our suggestions are useful, please let us know by giving it a like or marking it as a solution.


Salepify: Efficiently increase sales conversion with sale-driven features like auto add to cart, free gifts (free plan available)


Salemate: Boost your AVO with 2-layer offer, countdown upsell in your post purchase page


BSS Commerce - Full-service eCommerce Agency | Use Shopify for 1$ in the first month now
Luminora
Tourist
8 0 6

Luminora.shop

BSS-TekLabs
Shopify Partner
2401 695 836

- Here is the solution for you @Luminora 
- Please follow these steps:

step.png

- Then find the base.css file.
- Then add the following code at the end of the file and press 'Save' to save it.

.product__info-container .price--on-sale .price-item--regular { 
        color: red !important;
}

- Here is the result you will achieve:

BSSTekLabs_0-1720453785477.png

 

 

- Please press 'Like' and mark it as 'Solution' if you find it helpful. Thank you.

If our suggestions are useful, please let us know by giving it a like or marking it as a solution.


Salepify: Efficiently increase sales conversion with sale-driven features like auto add to cart, free gifts (free plan available)


Salemate: Boost your AVO with 2-layer offer, countdown upsell in your post purchase page


BSS Commerce - Full-service eCommerce Agency | Use Shopify for 1$ in the first month now

PageFly-Amelia
Shopify Partner
626 165 238

This is an accepted solution.

Hi @Luminora 

This is Amelia from PageFly - Landing Page Builder App

 

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 bottom of the file -> Save

 

.price__badge-sale {

    color: white !important;

}

 

Hope that my solution works for you.

Best regards,

Amelia | PageFly

Please let me know if it works by giving it a Like or marking it as a solution!


➜ Optimize your Shopify store with PageFly Page Builder (Free plan available) 
➜ Weekly updated Shopify tutorials on YouTube 


All features are available from Free plan. Live Chat Support is available 24/7.

Luminora
Tourist
8 0 6

It worked! Thanks

PageFly-Amelia
Shopify Partner
626 165 238

you are welcome @Luminora 😊

Please let me know if it works by giving it a Like or marking it as a solution!


➜ Optimize your Shopify store with PageFly Page Builder (Free plan available) 
➜ Weekly updated Shopify tutorials on YouTube 


All features are available from Free plan. Live Chat Support is available 24/7.