To display a badge on the product list when a product is out of stock, you can use the following code:
// Check if product is out of stock if (!$product->is_in_stock()) { // Display badge (replace 'out of stock' with whatever text/icon you want to display) echo '<div class="out-of-stock-badge">Out of Stock</div>'; }
You can add this code to the 'content-product.php' or a similar file within WooCommerce templates folder. This will check if the product is out of stock and display a badge with the text "Out of Stock" if it is. You can customize the badge markup and CSS to fit your needs.
Thank you Ramzan for the piece of code. I'm indeed going to use this code, but I'll use the hook "woocommerce_before_shop_loop_item" to display it instead of overriding a template.
The file for showing the individual products in product category \ archive pages is:
salient\nectar\helpers\woocommerce.php
Now that line appears several times in the file. We are referring to:
<div class="product-wrap">
because they are different possible layouts.
You can try and add the code inside those divs. An alternative is to hook into one of the actions used in the file like:
nectar_woocommerce_before_shop_loop_item_add_to_cart or the woocommerce provided woocommerce_after_shop_loop_item_title
Here is some example code:
add_action( 'woocommerce_after_shop_loop_item_title', 'add_badge_function');
function add_badge_function() {
if( is_shop() ){
global $product;
if (!$product->is_in_stock()) {
// Display badge (replace 'out of stock' with whatever text/icon you want to display)
echo '<div class="out-of-stock-badge">Out of Stock</div>';
}
}
}
This is and example and might not work. We are using it just to explain how you could go about this.
Thank you for your proposition. I tried it but is_shop() returned false so I removed it.
Here is a working solution:
add_action( 'woocommerce_before_shop_loop_item', 'add_badge_outofstock');
function add_badge_outofstock()
{
global $product;
if (!$product->is_in_stock())
{
echo '<div class="out-of-stock-badge">Out of stock</div>';
}
}
Hi,
I would like to know if there's a functionality in salient that allows to display a badge on the product list when a product is out of stock?
BR,
Clara.
Hey Again,
Please provide the page URL so we can write up what's possible.
Thanks.
ThemeNectar Support Team
Hi Clara,
Currently, the theme does not have an out-of-stock badge of any kind that can be added to products in the category or main product page areas.
You check and see if there is a plugin you can use to provide this feature on your site.
Hope this clears things up.
Hi Clara,
Yes it's possible without using any plugin
To display a badge on the product list when a product is out of stock, you can use the following code:
// Check if product is out of stock
if (!$product->is_in_stock()) {
// Display badge (replace 'out of stock' with whatever text/icon you want to display)
echo '<div class="out-of-stock-badge">Out of Stock</div>';
}
You can add this code to the 'content-product.php' or a similar file within WooCommerce templates folder. This will check if the product is out of stock and display a badge with the text "Out of Stock" if it is. You can customize the badge markup and CSS to fit your needs.
Thank you Noah for the information!
Thank you Ramzan for the piece of code. I'm indeed going to use this code, but I'll use the hook "woocommerce_before_shop_loop_item" to display it instead of overriding a template.
Hi Clara,
The file for showing the individual products in product category \ archive pages is:
salient\nectar\helpers\woocommerce.php
Now that line appears several times in the file. We are referring to:
because they are different possible layouts.
You can try and add the code inside those divs.
An alternative is to hook into one of the actions used in the file like:
nectar_woocommerce_before_shop_loop_item_add_to_cart or the woocommerce provided woocommerce_after_shop_loop_item_title
Here is some example code:
add_action( 'woocommerce_after_shop_loop_item_title', 'add_badge_function'); function add_badge_function() { if( is_shop() ){ global $product; if (!$product->is_in_stock()) { // Display badge (replace 'out of stock' with whatever text/icon you want to display) echo '<div class="out-of-stock-badge">Out of Stock</div>'; } } }This is and example and might not work. We are using it just to explain how you could go about this.
Hope you can work from there.
Hi Noah,
Thank you for your proposition. I tried it but is_shop() returned false so I removed it.
Here is a working solution:
add_action( 'woocommerce_before_shop_loop_item', 'add_badge_outofstock'); function add_badge_outofstock() { global $product; if (!$product->is_in_stock()) { echo '<div class="out-of-stock-badge">Out of stock</div>'; } }