• GoDaddy Community
  • Websites + Marketing | Website Builders
  • Websites + Marketing | Website Builders

    Showing results for 
    Show  only  | Search instead for 
    Did you mean: 
    Go to solution

    How to Change Woocommerce Cart and Checkout Colors

    I have added images for your reference. I am trying to make all the red circled and squared

    areas that have either text or lines White. I have dark backgrounds throughout the entire site and require white writing and borders for the majority of it. I am using the woocommerce cart and checkout shortcodes. What you see is a result of that.


    Under the Product section, there should be a description of the product. The first one has black text which you can't see. The second, I am hovering over it so it shows yellow. There's a privacy policy link in dark blue which I also need white. Again, all the circled and squared sections need white text. How can I make the necessary changes? I have WinSCP for editing but, I don't know where to go to make the changes. I have only used Elementor with the Ocean WP theme for the building. Any advise helps. Thank you. 


    3 REPLIES 3
    Super User II Super User II
    Super User II

    Re: How to Change Woocommerce Cart and Checkout Colors



    Your screenshot images are not displaying for me....   What you can do is when viewing your site,  mouse-over the area you want to change and then right click.


    In Firefox: Right Click > Inspect Element

    In Chrome: Right Click > Inspect


    You can then see the specific file name and styles that need to be changed for those elements. If you double-click on a style, you can change it right there to see a preview of what it would look like before implementing any actual changes.


    If the color elements are handled by your theme (better yet, a child theme) you can put the modified CSS in Appearance > Customize > Additional CSS without having to modify any actual theme files.


    HTH! 😉


    "Many of life's failures are people who did not realize how close they were to success when they gave up." ~Thomas Edison

    Re: How to Change Woocommerce Cart and Checkout Colors

    Thank you so much for your response. When I try to add the css, it doesn't change anything. I'm not sure if I'm adding the right css. When I right click and select "inspect," it shows me the code and highlights the section. I copied and pasted into the css customizer. Is that wrong?


    I'm not sure why you are unable to see the images I uploaded. I will try to remove them and just upload one. 

    Re: How to Change Woocommerce Cart and Checkout Colors

    I got it. Since I've been using Elementor for the whole thing, I tried adding the custom CSS there and it worked. Thank you very much @Muse! I've been questioning, youtubing and researching for a response for weeks. I can't believe how simple it turned out to be. Thank you.