Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Change Flatsome theme 'Out of Stock' label to 'Sold' - Change the 'Out of stock' banner in Flatsome theme to 'Sold'. https://www.damiencarbery.com/2020/06/change-flatsome-theme-out-of-stock-label-to-sold/
<?php
/*
Plugin Name: Change Flatsome theme 'Out of Stock' label to 'Sold'
Plugin URI: https://www.damiencarbery.com/2020/06/change-flatsome-theme-out-of-stock-label-to-sold/
Description: Change the 'Out of stock' banner in Flatsome theme to 'Sold'. Also works when [ux_products] shortcode is used.
Author: Damien Carbery
Author URI: https://www.damiencarbery.com
Version: 0.2
*/
// Return whether a product is in the Hire category.
function is_hire_category( $product_id ) {
if ( has_term( array( 'hire' ), 'product_cat', $product_id ) ) {
return true;
}
return false;
}
// Add 'Sold' banner if product is out of stock. CSS will hide the 'Out of Stock' div.
add_action( 'flatsome_woocommerce_shop_loop_images', 'dcwd_add_sold_label' );
function dcwd_add_sold_label() {
global $product;
if ( ! $product->is_in_stock() ) {
$message = 'Sold';
// Mark hire items as Unavailable instead of Sold.
if ( is_hire_category( $product->get_id() ) ) {
$message = 'Unavailable';
}
echo '<div class="out-of-stock-label sold-label">'.$message.'</div>';
// Add the CSS to hide the 'Out of Stock' div.
add_action( 'wp_footer', 'dcwd_hide_out_of_stock_banner' );
}
}
// Change the 'Out of Stock' text in the single product page too.
add_filter( 'woocommerce_get_availability_text', 'dcwd_get_availability_text', 10, 2 );
function dcwd_get_availability_text( $availability, $product ) {
if ( ! $product->is_in_stock() ) {
// Mark hire items as Unavailable instead of Sold.
if ( is_hire_category($product->get_id() ) ) {
return 'Unavailable';
}
return 'Sold';
}
return $availability;
}
// If the content has the [ux_products] shortcode then add the required CSS/JS to the footer.
add_filter( 'the_content', 'dcwd_check_ux_products_shortcode', 5 );
function dcwd_check_ux_products_shortcode( $content ) {
if ( has_shortcode( $content, 'ux_products' ) ) {
add_action( 'wp_footer', 'dcwd_change_out_of_stock_banner' );
add_filter( 'the_content', 'dcwd_change_out_of_stock_text', 20 );
}
return $content;
}
// Filter the page content to change the 'Out of stock' div with a 'Sold' one.
function dcwd_change_out_of_stock_text( $content ) {
return str_replace( '<div class="out-of-stock-label">Out of stock</div>', '<div class="out-of-stock-label sold-label">Sold</div>', $content );
}
// Rotate the label with CSS.
function dcwd_change_out_of_stock_banner() {
?>
<style>
/* Rotate the 'Sold' label. */
.row-masonry .out-of-stock-label.sold-label { /*opacity: 0.9;*/ transform: rotate(-20deg); width: 110%; margin-left: -5%; z-index: 200; }
</style>
<?php
}
// Hide the 'Out of Stock' banner and show the 'Sold' one.
//add_action( 'wp_footer', 'dcwd_hide_out_of_stock_banner' );
function dcwd_hide_out_of_stock_banner() {
?>
<style>
/* Hide 'Out of stock' message and show new 'Sold' one. */
.box-image .out-of-stock-label { opacity:0;}
/* Rotate the 'Sold' label. */
.box-image .out-of-stock-label.sold-label { opacity: 0.9; transform: rotate(-20deg); width: 110%; margin-left: -5%; z-index: 200; }
</style>
<?php
}
@dako76

This comment has been minimized.

Copy link

@dako76 dako76 commented Mar 9, 2021

Can you add this Line on row 20 for changing color of the badge?

.box-image .out-of-stock-label.sold-label { opacity: 0.7; transform: rotate(-20deg); width: 110%; margin-left: -5%; z-index: 200; color: white; background-color: green; }

@damiencarbery

This comment has been minimized.

Copy link
Owner Author

@damiencarbery damiencarbery commented Mar 10, 2021

Can you add this Line on row 20 for changing color of the badge?

.box-image .out-of-stock-label.sold-label { opacity: 0.7; transform: rotate(-20deg); width: 110%; margin-left: -5%; z-index: 200; color: white; background-color: green; }

That's perfect - great suggestion.

@phonoxify

This comment has been minimized.

Copy link

@phonoxify phonoxify commented May 1, 2021

Thank you very much for the code! Works fine on my webshop!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment