Can you help me rearrange products that are out of stock? I do not want to hide the products that are out of stock, but I would like to show ofstock products at the end of woocommerce list if this is posible, and maybe to have a label or something that indicates the products it's out of stock so I do not make people click and the product to see in description that it's out of stock.
2. You could add an "out of stock" badge to products by adding the following snippet into the custom CSS box located in the Salient options panel > General Settings > CSS/Script related tab:
The changes I made above with translating the words and changing the color for the text, did not worked:) Can you help me? Also the badge only appears on one product but there are more products that are out of stock.
Hey Alis, checking out the source code I'm still seeing the wrong selector in use i.e.
ul.products li.product.stocepuizat:before
instead of:
ul.products li.product.outofstock:before
Can you please ensure that is updated from your end? If so, kindly provide a temporary admin account so that I can take a closer look at why it's not displaying.
I'm currently not seeing any difference in the display between those two pages - here's what I'm seeing on my end on the 2nd page URL which you mentioned was not right:
Can you provide a screenshot of what's occurring on your end?
Hi,
Can you help me rearrange products that are out of stock? I do not want to hide the products that are out of stock, but I would like to show ofstock products at the end of woocommerce list if this is posible, and maybe to have a label or something that indicates the products it's out of stock so I do not make people click and the product to see in description that it's out of stock.
Thank you!
Hey!
1. Altering the order of products would require a filter to be added to your child theme functions.php file. Here's a StackOverflow which discusses possible solutions for that: https://stackoverflow.com/questions/25113581/show-out-of-stock-products-at-the-end-in-woocommerce
2. You could add an "out of stock" badge to products by adding the following snippet into the custom CSS box located in the Salient options panel > General Settings > CSS/Script related tab:
ul.products li.product.outofstock:before { content: 'Out of Stock'; position: absolute; top: 20px; background-color: #000; color: #fff; padding: 10px; left: 20px; display: block; z-index: 100; }Hi,
Thank you. I have used your css with some small changes, the color of the writing and I have translated Out Of Stock:
ul.products li.product.stocepuizat:before {
content: 'Stoc Epuizat';
position: absolute;
top: 20px;
background-color: #000;
color: #efb1b1;
padding: 10px;
left: 20px;
display: block;
z-index: 100;
}
The changes I made above with translating the words and changing the color for the text, did not worked:) Can you help me? Also the badge only appears on one product but there are more products that are out of stock.
Thank you!
Hey Alis!
WooCommerce still uses the class name "outofstock" regardless of the language the site is in - the correct snippet would be:
ul.products li.product.outofstock:before { content: 'Stoc Epuizat'; position: absolute; top: 20px; background-color: #000; color: #efb1b1; padding: 10px; left: 20px; display: block; z-index: 100; }Kind regards,
Hey, Thank you,
Tried the css but nothing changed, and the badge only appears on 1 product not on all of the products that are out of stock.
Hey Alis, checking out the source code I'm still seeing the wrong selector in use i.e.
instead of:
Can you please ensure that is updated from your end? If so, kindly provide a temporary admin account so that I can take a closer look at why it's not displaying.
Hey
I'm currently not seeing any difference in the display between those two pages - here's what I'm seeing on my end on the 2nd page URL which you mentioned was not right:
Can you provide a screenshot of what's occurring on your end?
Hi,
Yes, it's fine:)) I am sorry and thank you. Sometimes I clear all cache and still nothing changes. It's ok now.
Thank you!
You're welcome, Alis