Return to previous page

Change prices colors in shop page and wishlist icon

This topic has 4 replies, 2 voices, and was last updated 10 months, 1 weeks ago ago by Tony Rodriguez

devprof

Participant

January 11, 2024 at 22:44

I want to Change prices colors in shop page,
and wishlist icon when i click

#379646 Copied Theme version: 9.2.5 WooCommerce version: 8.5.0

3 Answers
Tony Rodriguez

Support staff

January 12, 2024 at 11:42
Hello, @devprof,

Thank you for using our theme and for contacting us.

1/ We would like to guide you through the process of altering the color of the product prices on your Shop page. Kindly follow the steps outlined below:

1. Copy the following CSS code:
```
.content-product .price span.woocommerce-Price-amount.amount bdi {
       color: red !important;
   }
```
2. Navigate to “Xstore” followed by “Theme Options.”
3. Proceed to “Theme Custom CSS.”
4. Paste the copied code into the “Global CSS” section.

After completing these steps, please ensure to clear your browser’s cache before revisiting your site to view the changes.

2) Regarding the wishlist icon, you can easily modify it by following these steps:

a)Navigate to XStore>>Theme Settings>>WooCommerce(Shop)>>Wishlist.
b)In this section, you will find the option to add a custom SVG icon of your choice.

Visual reference:https://imgur.com/a/3jub25F

Feel free to reach out if you have any further questions or if there’s anything else we can assist you with. We appreciate your patience and look forward to helping you create the perfect shopping experience on your website.

Kind Regards,
8theme team
#379684 Copied
devprof

Participant

January 16, 2024 at 08:05

I want to change just sale price.

#380029 Copied
Tony Rodriguez

Support staff

January 16, 2024 at 09:13
Hello, @devprof,

Thank you for your response.

Should you desire to modify the color of the sale price exclusively on the shop page, we kindly request that you remove the previously supplied CSS code. Subsequently, please insert the new CSS code by navigating to XStore > Theme Options > Theme Custom CSS > Global CSS within your theme settings.

Below is the CSS code for altering the sale price color:
```
span.price ins span.woocommerce-Price-amount.amount {
    color: #ff83a4 !important;
}
```
Please note that the color value in the CSS code can be adjusted to suit your preferences.

We trust that this solution will address your concern. Should you require further assistance, please do not hesitate to contact us.

Best Regards,
The 8Theme Team
#380041 Copied
Tagged: enhance woocommerce shop page, personalize woocommerce wishlist, price color change woocommerce, shop page design woocommerce, woocommerce theme customization, woocommerce wishlist icon update, wordpress themes customization
Viewing 4 results - 1 through 4 (of 4 total)