woocommerce integration with Arcon theme

[jwarhus]

I’m having issues with Woocommerce and the Arcon theme. Some of the drop menus have a background color that doesn’t work well with my theme background and text color scheme. On variable products pages, the drop menus have a light background color which does not provide enough contrast with theme colors to be readable. Same is true on cart page in calculate shipping drop menus and on checkout page drop down menus. I’ve included links to these pages below:
http://www.john-warhus.com/product/desert-survivor/
http://www.john-warhus.com/main-page-1/shop/cart/
http://www.john-warhus.com/main-page-1/shop/cart/checkout/

I would like to make the backgrounds in all of these menus black or dark gray. How do I do that?

[7Theme Support]

Hi,

please go to WordPress admin -> Appearance -> Theme Options -> General -> Extra CSS Content and add this:

option {
background:#000;
color:#fff;
}

This CSS code should solve the problem

[jwarhus]

I inserted the code you suggested, but the result didn’t really solve the problem.

First, it appears that the problem is different in each browser. In safari, firefox, and chrome, the initial appearance of the option boxes match the theme color scheme. In IE, the initial color of the option boxes is white. This was true before I inserted the recommended code.

The inserted code at no affect on IE or Chrome

In Firefox, the problem is partially fixed with the inserted code. The dropdown menus in Firefox now look like ladders with the text having a black background immediately beneath. But there is still the light colored background that looks like the ladder. On the checkout page, there was no affect; there the text is still unreadable because of the light colored background.

In safari, the product and cart pages the menus work fine, but the checkout page still has the light background, making text unreadable.

[jwarhus]

One last comment. In safari, the product and cart pages worked fine before adding the code you recommended.

[7Theme Support]

Hi,

we’ve tested it with safari, and all is working. For the Firefox problem: please add this code to the Extra CSS Content:

option {
margin:0;
}

This should solve the problem.

For the IE: What version of the Internet Explorer are you using?

[jwarhus]

Added new css as recommended. Results:

For Safari, Chrome and Firefox, product and cart pages working properly. On checkout page, country and state menus still have a light background for all these browsers, including safari.

I am using IE11 as my test browser. On product and cart pages, initial option menu box color are still incorrect. They are white before you click on them, background of dropdown menus is now black, but selection remains unreadable after you make a selection. On checkout page, now initial option menu box color is black, but text is also almost black. When selecting a country or state, drop down is still light colored and text is unreadable.

[jwarhus]

An additional note: on the page that shows the items I am selling (http://www.john-warhus.com/main-page-1/digital-prints/) there is a option box that allows the user to sort the products in various ways. IN IE11, that box background is white and so is drop down menu, so text is unreadable.

[jwarhus]

I’ve got everything ready to open my online store for the first time, but the issues that I presented in a couple of previous posts to this forum have not been solved. Have you made any progress in solving the on-going issues I posed in my previous posts?

Thanks,
J.W.

[7Theme Support]

Hi,

it seems you cant change the styles of dropdowns in Internet Explorer, please have a look at this post here:

http://stackoverflow.com/questions/6655625/styling-options-in-bold-in-internet-explorer

On checkout page, country and state menus still have a light background for all these browsers, including safari.

These options are ‘styled’ by the WooCommerce plugin, thats why the dropdowns are different. You can just try to change the color, please go to WordPress admin -> Appearance -> Theme Options -> General -> Extra CSS Content and add this:

.chosen-container .chosen-results li {
color:#000;
}

[jwarhus]

The code provided in last post didn’t change the way that country and state drop menus appear.

Given this result and the fact you noted about IE, it appears that my next alternative is to try to change the text color inside the menus that can’t have background changes.

Is it possible to change the text colors only in the offending menu boxes?

[jwarhus]

After a bit of testing, I found that I can change the text colors using the previous css mods that already you gave me. And I found that the change I said in previous post didn’t correct the problem on the checkout page, actually did fix it.

However, those controls have no affect on the appearance of the text in the option boxes when they are not selected; the text color there is still the theme’s text color.

So, the question still is, is it possible to change the text colors only in the offending menu boxes without having to change the whole color scheme to make them readable?

[jwarhus]

In the previous post, I failed to mention that the issue with appearance of option boxes is now only with IE. And, in IE the problem with theme colored text in options boxes occurs on the shop (in sort option box) and cart page (under calculate shipping country and state option boxes). On the checkout page, the issue is different. On that page, the background is black and when the box is not selected, the text is dark gray, making the readability of the text poor.

[7Theme Support]

Hi,

we’ve tested it, and it the major browsers all looks fine (exclude ‘country’ and ‘state’, but thats styled by the woocoomerce plugin). What browser do you use?

[jwarhus]

I’ve given up on waiting for help on this problem from 7theme. You are now saying that the problem lies within woocommerce. However, you provide style sheets and other support for the woocommerce plugin that should provide the capability to modify woocommerce styles. The claim that the thene is woocommerce compatible is apparently not true.

To address the issue, I have made changes to my theme color scheme to correct the problem with text readability. I really didn’t want to make that change, but it seems I have no choice since 7theme doesn’t have a solution to my problem.

[7Theme Support]

We’ve never claimed that the theme support the woocommerce shop plugin! If the plugin has problems with some browsers, it’s not the problem of our theme! And the default content background of the arcon theme is white, I’m sure with the default background there are no problems.

[Author]

Posts