Return to previous page

Change the price color on shop and change discounted price color

This topic has 3 replies, 2 voices, and was last updated 1 years, 9 months ago ago by Aasem

Aasem

Participant

March 15, 2023 at 03:57

Hello,
I’d like to change the main price color that is displayed on the shop pages. I keep seeing that it uses this variable: –et_main-color, but I can’t find a way to change it.

Also, i’d like to change the discounted price color (not the sale): https://prnt.sc/xn6wM4mPqWGX
But it doesn’t seem to have a separate class!
I want to display all active prices in a single color (e.g pink), including sale prices, and grey for the discounted prices (the ones with strikethrough). Is this possible?

Another issue: the main header wishlist icon and title are stacked: https://prnt.sc/0u6jb-QFrX_z
But inlined in the advanced sticky header: https://prnt.sc/icG5z43fqn_P
How can I fix it?

Please advise

#350036 Copied Theme version: 9.0.5 WooCommerce version: 7.4.1

2 Answers
Tony Rodriguez

Support staff

March 15, 2023 at 05:15
Hello, @Aasem,

Thank you for choosing XStore as your WooCommerce WordPress theme.

1) To change the color of the regular, sale and discount prices on the Shop page, or on the related products which appear on product pages, please copy and paste the following CSS code into Xstore >> Theme Options >> Theme Custom CSS >> Global CSS:
```
span.price del span.woocommerce-Price-amount.amount {
color: grey !important;
}

span.price span.woocommerce-Price-amount.amount {
color: #ff83a4 !important;
}

span.price ins span.woocommerce-Price-amount.amount {
color: #ff83a4 !important;
}
```
Please refer to the following link for the desired result: https://postimg.cc/4m21xYtN

We hope you can find the color that best suits your needs, whether it be a name or a color code.

2) We are pleased to inform you that your issue has been resolved. Please clear your browser cache and revisit your site. We have adjusted the width of the wishlist widget under the header builder, which has solved the issue. For further reference, please watch the video at the following link: https://www.veed.io/view/03774174-1101-49cc-b399-d139cdbc01ee?sharingWidget=true&panel=share

Best Regards,
8Theme’s Team
#350040 Copied
Aasem

Participant

March 15, 2023 at 13:42

This is Awesome! Thanks a lot Tony.
Really appreciate your great support guys.
Have a great day

#350107 Copied
Tagged: change, color, discounted price, price, themes, woocommerce, wordpress
Viewing 3 results - 1 through 3 (of 3 total)

The issue related to '‘change the price color on shop and change discounted price color’' has been successfully resolved, and the topic is now closed for further responses

Change the price color on shop and change discounted price color

Recent Topics

Helpful Topics

Useful links WooCommerce & WordPress

Browse by popular tags:

Explore our best WordPress WooCommerce Themes collection