1

The following code from a previous answer to one of my questions displays Woocommerce "Size" product attributes below each product on the shop page:

add_action( 'woocommerce_after_shop_loop_item_title', 'display_size_attribute', 5 );
function display_size_attribute() {
    global $product;

    if ( $product->is_type('variable') ) {
        $taxonomy = 'pa_size';
        echo '<span class="attribute-size">' . $product->get_attribute($taxonomy) . '</span>';
    }
}

How do I change the code to only display "in-stock" items (of product attribute "Size")?

2

To get only available "In stock" displayed sizes, you need something a little more complicated and different:

add_action( 'woocommerce_after_shop_loop_item_title', 'display_instock_sizes', 5 );
function display_instock_sizes() {
    global $product;

    if ( $product->is_type('variable') ) {
        $taxonomy    = 'pa_size'; // The product attribute taxonomy
        $sizes_array = []; // Initializing

        // Loop through available variation Ids for the variable product
        foreach( $product->get_children() as $child_id ) {
            $variation = wc_get_product( $child_id ); // Get the WC_Product_Variation object

            if( $variation->is_purchasable() && $variation->is_in_stock() ) {
                $term_name = $variation->get_attribute( $taxonomy );
                $sizes_array[$term_name] = $term_name;
            }
        }

        echo '<span class="attribute-size">' . implode( ', ', $sizes_array ) . '</span>';
    }
}

Code goes in functions.php file of the active child theme (or active theme). Tested and works.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.