Woocommerce Question posted in
The official Woocommerce documentation can be found here.

Woocommerce – Apply css rules in php condition

I add some custom stock status messages on WooCommerce with some PHP code like this :

    //Ajoute "En stock" sous chaque produit
function show_stock() {
    global $product;
    if ( $product->managing_stock() ) { // if manage stock is enabled 
        if (( number_format($product->get_stock_quantity(),0,'','') > 0 ) && ( number_format($product->get_stock_quantity(),0,'','') < 100 )) { // if in stock
            echo '<div class="remaining" style="color:green;">En stockk</div>';
        } elseif (( number_format($product->get_stock_quantity(),0,'','') >= 100 ) && ( number_format($product->get_stock_quantity(),0,'','') < 1000 )) {
            echo '<div class="remaining" style="color:#f2cd00;">Livraison sous 1 mois</div>';
        } elseif (( number_format($product->get_stock_quantity(),0,'','') >= 1000 ) && ( number_format($product->get_stock_quantity(),0,'','') < 2000 )) {
            echo '<div class="remaining" style="color:#f2cd00;">Livraison sous 7 jours</div>';
        } elseif ( number_format($product->get_stock_quantity(),0,'','') < 1 ) {
            echo '<div class="remaining" style="color:red;">Rupture</div>'; 
        }
    }
}

add_action('woocommerce_after_shop_loop_item','show_stock', 10);
add_action ('woocommerce_before_add_to_cart_form','show_stock');

And i apply this CSS rule for make disappear the default WooCoomerce stock message in my single product page and avoid double stock status messages.

p.stock{
    display: none;
}

The Problem that i have is my PHP code not working anymore when stock = 0 and then my last conditional of php code isn’t apply (not showing my custom message “Rupture”).

And because i applied my CSS rule when my stock = 0 i have no stock status.

Then i would like to apply my CSS rule only when my stock > 0.
Or
Find way to make apply my last conditional php for stock < 1.

:'( thank you

Tags:

3

Answers


  1. Chosen as BEST ANSWER
    0

    OMG Thanks a lot 7uc1f3r and thanks to all for your reply and participation.

    I tryed your code and it's work like a charm. I didn't know how to just replace the default stock status.

    I just added CSS for the single procut page because the custom color was not taken just cause the different class (stock.custom-stock-color)

    This is the final code adapted for my site:

    ***********************************************************PHP****************************************

      // Change availability text - Single product page
function change_stock_text( $text, $product ) { 
    // Managing stock enabled
    if ( $product->managing_stock() ) {

        // Get stock status
        $stock_quantity = $product->get_stock_quantity();

        if ( $stock_quantity == 0 ) {
            $text = __( 'Rupture', 'woocommerce' );
        } elseif ( $stock_quantity >= 1 && $stock_quantity < 100 ) {
            $text = __( 'En stock', 'woocommerce' );          
        } elseif ( $stock_quantity >= 100 && $stock_quantity < 1000 ) {
            $text = __( 'Livraison sous 7 jour', 'woocommerce' );          
        } elseif ( $stock_quantity >= 1000 && $stock_quantity < 2000 ) {
            $text = __( 'Livraison sous 1 mois', 'woocommerce' );          
        } else {
            $text = __( 'Reliqua fournisseur', 'woocommerce' );          
        }
    }

    // Output
    return $text;
}
add_filter( 'woocommerce_get_availability_text', 'change_stock_text', 10, 2 );

// Change availability class - Single product page
function change_stock_class( $class, $product ) {   
    // Managing stock enabled
    if ( $product->managing_stock() ) {

        // Get stock status
        $stock_quantity = $product->get_stock_quantity();

        if ( $stock_quantity == 0 ) {
            $class = 'custom-stock-red';
        } elseif ( $stock_quantity >= 1 && $stock_quantity < 100 ) {
            $class = 'stock custom-stock-green';         
        } elseif ( $stock_quantity >= 100 && $stock_quantity < 1000 ) {
            $class = 'stock custom-stock-orange';         
        } elseif ( $stock_quantity >= 1000 && $stock_quantity < 2000 ) {
            $class = 'stock custom-stock-blueviolet';            
        } else {
            $class = 'stock custom-stock-purple';     
        }
    }

    // Output    
    return $class;
}
add_filter( 'woocommerce_get_availability_class', 'change_stock_class', 10, 2 );

// Add html - Shop/Category page
function action_woocommerce_after_shop_loop_item() {
    global $product;

    // Managing stock enabled
    if ( $product->managing_stock() ) {

        // Get stock status
        $stock_quantity = $product->get_stock_quantity();

        if ( $stock_quantity == 0 ) {
            $stock_html = '<div class="custom-stock-red">' . __( 'Rupture', 'woocommerce' );
        } elseif ( $stock_quantity >= 1 && $stock_quantity < 100 ) {
            $stock_html = '<div class="custom-stock-green">' . __( 'En stock', 'woocommerce' );      
        } elseif ( $stock_quantity >= 100 && $stock_quantity < 1000 ) {
            $stock_html = '<div class="custom-stock-orange">' . __( 'Livraison sous 7 jours', 'woocommerce' );  
        } elseif ( $stock_quantity >= 1000 && $stock_quantity < 2000 ) {
            $stock_html = '<div class="custom-stock-blueviolet">' . __( 'Livraison sous 1 mois', 'woocommerce' );          
        } else {
            $stock_html = '<div class="custom-stock-purple">' . __( 'Reliqua fournisseur', 'woocommerce' );  
        }

        // Add closing div
        $stock_html .= '</div>';

        // Output
        echo $stock_html;
    }
}
add_action( 'woocommerce_after_shop_loop_item', 'action_woocommerce_after_shop_loop_item', 10, 0 );

    ************************CSS***********************

    /*loop page > Custom stock status color */
.custom-stock-red {
    color: red;
}

.custom-stock-green {
    color: green;
}

.custom-stock-orange {
    color: #f4a400;
}

.custom-stock-blueviolet {
    color: blueviolet;
}

.custom-stock-purple {
    color: purple;
}

/*single product page > Custom stock status color */
.stock.custom-stock-red {
    color: red !important;
}

.stock.custom-stock-green {
    color: green !important;
}

.stock.custom-stock-orange {
    color: #f2cd00 !important;
}

.stock.custom-stock-blueviolet {
    color: blueviolet !important;
}

.stock.custom-stock-purple {
    color: purple !important;
}

    *****************************THANK YOU AGAING*******************************


  2. 0

    i recomend refactoring your code because your “logic” is correct, but your semantic is no so god.

    1 – define type for return $product->get_stock_quantity()

    2 – In php type number is equivalent to string too (because as dynamic type)

    3 – Verify that $product->get_stock_quantity() return value when list has empty

    Login or Signup to reply.
  3. 0

    The following code shows how to change text & class, both on the Single product page + add html on the Shop/Category page

    In this way you can adjust or add your custom availability text/class.

    P.s the code could be shorter but has been extended so that you can clearly see which adjustment is made where.

    woocommerce_get_availability_text – Change availability text – Single product page

    woocommerce_get_availability_class – Change availability class – Single product page

    woocommerce_after_shop_loop_item – Add html – Shop/Category page

    PHP: Add to functions.php

    // Change availability text - Single product page
function change_stock_text( $text, $product ) { 
    // Managing stock enabled
    if ( $product->managing_stock() ) {

        // Get stock status
        $stock_quantity = $product->get_stock_quantity();

        if ( $stock_quantity == 0 ) {
            $text = __( 'Text 1', 'woocommerce' );
        } elseif ( $stock_quantity >= 1 && $stock_quantity < 100 ) {
            $text = __( 'Text 2', 'woocommerce' );          
        } elseif ( $stock_quantity >= 100 && $stock_quantity < 1000 ) {
            $text = __( 'Text 3', 'woocommerce' );          
        } elseif ( $stock_quantity >= 1000 && $stock_quantity < 2000 ) {
            $text = __( 'Text 4', 'woocommerce' );          
        } else {
            $text = __( 'Text 5', 'woocommerce' );          
        }
    }

    // Output
    return $text;
}
add_filter( 'woocommerce_get_availability_text', 'change_stock_text', 10, 2 );

// Change availability class - Single product page
function change_stock_class( $class, $product ) {   
    // Managing stock enabled
    if ( $product->managing_stock() ) {

        // Get stock status
        $stock_quantity = $product->get_stock_quantity();

        if ( $stock_quantity == 0 ) {
            $class = 'custom-stock-green';
        } elseif ( $stock_quantity >= 1 && $stock_quantity < 100 ) {
            $class = 'custom-stock-orange';         
        } elseif ( $stock_quantity >= 100 && $stock_quantity < 1000 ) {
            $class = 'custom-stock-orange';         
        } elseif ( $stock_quantity >= 1000 && $stock_quantity < 2000 ) {
            $class = 'custom-stock-red';            
        } else {
            $class = 'custom-stock-some-color';     
        }
    }

    // Output    
    return $class;
}
add_filter( 'woocommerce_get_availability_class', 'change_stock_class', 10, 2 );

// Add html - Shop/Category page
function action_woocommerce_after_shop_loop_item() {
    global $product;

    // Managing stock enabled
    if ( $product->managing_stock() ) {

        // Get stock status
        $stock_quantity = $product->get_stock_quantity();

        if ( $stock_quantity == 0 ) {
            $stock_html = '<div class="custom-stock-green">' . __( 'Text 1', 'woocommerce' );
        } elseif ( $stock_quantity >= 1 && $stock_quantity < 100 ) {
            $stock_html = '<div class="custom-stock-orange">' . __( 'Text 2', 'woocommerce' );      
        } elseif ( $stock_quantity >= 100 && $stock_quantity < 1000 ) {
            $stock_html = '<div class="custom-stock-orange">' . __( 'Text 3', 'woocommerce' );  
        } elseif ( $stock_quantity >= 1000 && $stock_quantity < 2000 ) {
            $stock_html = '<div class="custom-stock-orange">' . __( 'Text 4', 'woocommerce' );          
        } else {
            $stock_html = '<div class="custom-stock-some-color">' . __( 'Text 5', 'woocommerce' );  
        }

        // Add closing div
        $stock_html .= '</div>';

        // Output
        echo $stock_html;
    }
}
add_action( 'woocommerce_after_shop_loop_item', 'action_woocommerce_after_shop_loop_item', 10, 0 );

    CSS: Add to an external style sheet, your CSS theme file or via a plugin

    .custom-stock-green {
    color: green;
}

.custom-stock-orange {
    color: #f2cd00;
}

.custom-stock-red {
    color: red;
}

.custom-stock-some-color {
    color: blueviolet;
}
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search