Hey there, @gkaralov! Thanks for contacting us. I’m happy to help you.
We can share the CSS code to change that 🙂
But to do that we would need the URL of a product that has the “in stock” message and another one that has the “only %s available” message so we can check the classes on it and make sure we share the correct code.
Can you please share both URLs with us so we can assist you further?
To target each product status separately and assign different colors, you need to use specific CSS classes associated with each status. If you inspect it, you should see a specific CSS class name to target it.
Unfortunately, without the exact details of your theme and your site URL, we can’t provide the precise CSS code. However, the CSS class and code could be something like this:
This seems to be the default and expected behavior. However, you can customize further by adding an extra class to the stock notice. Here is a resource that might help you further:
Please note that writing or providing custom code is not within the scope of our support policy. If you still need assistance, we recommend asking development questions on the #developers channel of the WooCommerce Community Slack. Many of our developers hang out there and will be able to offer insights into your question. You can also seek help from the following:
I checked your site and it seems there’s something overwriting the CSS code you added.
Can you please try this:
.stock.in-stock {
color: red !important;
}
.stock.in-stock.few-in-stock {
color: red !important;
}
But please note that on the code you shared both classes are set to red, so if you want them to be different colors, make sure to update this on the code 🙂
