Home › Forums › WoodMart support forum › Cart icon colors

Cart icon colors

Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • July 10, 2025 at 10:49 am #672817

    cavespacestudio
    Participant

    How do I edit the colors of the shopping card on the upper right corner? I would lke to edit the color of the number, the cart background, and the cart color. Is there a way? Or CSS class?

    July 10, 2025 at 12:57 pm #672869

    Aizaz Imtiaz Awan
    Keymaster
    Xtemos team

    Hello,

    Sorry to say your site is not working due to a server issue. https://postimg.cc/PPpFKxW9

    Please try to check your site. Then let me know, I will further check on your site and give you a possible CSS code for the cart icon.

    Best Regards

    July 11, 2025 at 7:03 am #673000

    cavespacestudio
    Participant

    Yes sorry I was making changes to my server. It is working now.

    July 11, 2025 at 12:35 pm #673100

    Aizaz Imtiaz Awan
    Keymaster
    Xtemos team

    Hello,

    Navigate to Theme Settings > Custom CSS > Global and add the following CSS:

    /* Change background color of the cart number bubble */
.wd-header-cart .wd-cart-number {
    background-color: #0048ff !important; /* Change this to your preferred color */
}

/* Change text color of the number */
.wd-header-cart .wd-cart-number span,
.wd-header-cart .wd-cart-number {
    color: #ffffff !important; /* Number color */
}
    .wd-header-cart .wd-tools-icon {
    color: #ff0101 !important; /* Icon color */
}

    Best Regards,

    July 11, 2025 at 12:45 pm #673102

    cavespacestudio
    Participant

    Thank you. And how about for the button background color?

    July 11, 2025 at 12:46 pm #673103

    cavespacestudio
    Participant

    I meant the button background color for the cart button.

    July 11, 2025 at 3:34 pm #673473

    Aizaz Imtiaz Awan
    Keymaster
    Xtemos team

    Hello,

    Navigate to Theme Settings > Custom CSS > Global and add the following CSS:

    .wd-header-cart.wd-tools-element.wd-design-7>a>:is(.wd-tools-inner,.wd-tools-icon) {
    background-color: black !important;
}

    Best Regards,

    July 12, 2025 at 1:39 am #673542

    cavespacestudio
    Participant

    Thank you.

    July 12, 2025 at 10:36 am #673563

    Aizaz Imtiaz Awan
    Keymaster
    Xtemos team

    Hello,

    You’re very welcome! If you need anything else, feel free to reach out!

    Thanks for contacting us.
    Have a great day.

    Topic Closed.
    Best Regards,

  • Author
    Posts
Viewing 9 posts - 1 through 9 (of 9 total)

The topic ‘Cart icon colors’ is closed to new replies.