In the Vantage theme we have set link color to red (#C40000), button background to red (#C40000), and button text white (#ffffff). This works in pages and posts for the most part, but in WooCommerce Product Archives and Product pages, and in the Pricing Table widget button links, the colors revert to the default theme color blue. I am using the following CSS to sync the WooCommerce and Pricing table link and button colors with our theme colors:
This corrects most of the color problems, but creates problem with some buttons. Buttons are unreadable if both text and background are Red. This occurs in the Woo Shopping Cart even when the woo button settings are white on Red. This also occurs in the Pricing Table widget if button background is set to Red. I have worked around this issue by styling the button colors with a light grey background that is compatible with the red text.
Is there another way to correct the color settings in the WooCommerce pages and Pricing Table Widget?
Link to our shopping cart:
https://www.backtpack.com/purchase/backtpack-store/
Link to a page with a pricing table:
https://www.backtpack.com/product-info/features/
Hi Evollo,
The price table buttons aren’t designed to be affected by theme styling (instead, its handled in the widget itself) so I’m unsure why you needed to do that. Can you please provide me with a copy of the CSS you applied to override the button styling for that so I can check it?
Regarding WooCommerce, that’s odd. I don’t see anything in your markup to suggest the colors should be the stated colors. To confirm, you changed the button color by navigating to WP AdminAppearanceCustomize, Theme DesignButtons right?
We cannot leave our preferred button color settings active, as then the buttons are rendered unreadable.
This is the CSS that we use for link colors, but it also affects the text color in the WooCommerce “Proceed to Checkout” and Vantage Price Table buttons. We need the buttons to have white text color.
#main a {
color: #c40000;
}
#main a:hover {
color: #820a2a;
}
In “WP Admin > Appearance > Customize > Theme Design > Buttons” we cannot set Checkout Button button color to white text on red background because then it renders the “Proceed to Checkout” button unreadable, as both text and background are red. Interestingly, the PayPal button appears as it should with white text on red background.
We are willing to PM our login credentials if you would like to check this directly.
Hi Evollo,
Ah. Okay, so that CSS is slightly too specific which is why it’s overriding the other color. You’ll need to either more specific (so only the areas you wish to affect are affected) or use a slightly different selector (such as .entry-content instead of main)
Regardless, would it be possible for you to create a temporary admin account for us so we can log in and take a look?
This is a private message.
Private Snippet
This is a private message.
This is a private message.
Hi Evollo,
Thanks. I just tried the following and it worked without issue for me:
There weren’t any readability issues. Can you please show me a screenshot of the exact issue you’re experiencing. Please note that we’re currently unable to process attachments so you’ll need to upload the image to a third party image hosting site like Imgur or vgy.me.
If that’s not what you’re looking to do, can you please send me a screenshot of what you’re attempting to do?