WooCommerce tables not displaying text

[quituck]

So my woocommerce settings are a bit wonky.

The text in the field on my product page are either white or not displaying.

I tried to change the color but am having trouble changing the color to black

I’ve tried using multiple selectors such as

.wc-product-table tbody td {
color: Black;
}
table.variations {
color: Black;
}

And nothing. Please advice!

I also am missing the product sort and filter for category pages. Any Idea how I can get it to appear?

[friech]

Hi There,

Thank you for writing in, this is the CSS rule that is causing the issue,

select,
textarea,
input[type="text"],
input[type="password"],
input[type="datetime"],
input[type="datetime-local"],
input[type="date"],
input[type="month"],
input[type="time"],
input[type="week"],
input[type="number"],
input[type="email"],
input[type="url"],
input[type="search"],
input[type="tel"],
input[type="color"],
.uneditable-input {
  background: #fff;
  padding: 20px 10px;
  border: none;
}

Please navigate to Theme Options > CSS and remove or reduce the padding of that rule.

Hope it helps,
Cheers!

[quituck]

Ah problem solved. Do you know how I can add the woocommerce filter and sort button to custom pages?

[basanta]

Hi There,

If you want to add filter option in . custom pages that might need custom coding which is out of our theme support scope.
You can check woo-commerce short code option for that.

Shortcodes included with WooCommerce - WooCommerce Docs

Hope this helps!

[quituck]

Okay. Can you tell me how to change the sidebar widget border color?

Using this code I changed the outside boarder on the sidebar.

.x-sidebar {
border: 5px solid hsl(199, 43%, 72%);
padding: 15px;
background-color: rgb(251, 251, 251);

}
.x-sidebar, .h-widget {
text-shadow: none !important;
color: hsl(199, 43%, 72%) !important;
}

I want to change the boarders of the widgets in the sidebar. How can I do that?

[Prasant]

Hello @quituck,

Thanks for asking.

If you would like to change the border color, then please add following CSS under X > Theme Options > CSS:

.x-sidebar .widget ul, .x-sidebar .widget ol {
    border-color: #000 !important;
}

On the other hand if you would like to change the border thickness and color, please use following CSS under X > Theme Options > CSS:

.x-sidebar .widget ul, .x-sidebar .widget ol {
    border: 2px solid #000 !important;
}

If you would like to change/remove roundness of border, then following CSS can be used under X > Theme Options > CSS:

.x-sidebar .widget ul, .x-sidebar .widget ol {
    border-radius: 0;
}

Feel free to change #000` to whatever color code you like.

1- I have found the proper CSS code selector using the Chrome browser Developer Toolbar:

https://www.youtube.com/watch?v=wcFnnxfA70g

2- For the CSS code itself, I suggest that you get started with this tutorial:

https://www.youtube.com/watch?v=yfoY53QXEnI

Thank you.

[quituck]

Thank you. Could you tell me why my convertplus plugin is not working? When I activate it, I get the white screen of death. Let me know, as I would like to be able to continue using the plugin.

[Prasant]

Hello @quituck,

Thanks for updating the thread.

I request you to please create a new ticket as this ticket is related with WooCommerce and already it’s diverting from the main topic. Having multiple different topics on the same topic creates a lot of confusion and increases the response time. Please create a new ticket and someone from support team will take a look.

Thanks.

[quituck]

Sure thing.

[paul.r]

Thank you for creating a new ticket.