On a website, I need to display out-of-stock variations in the drop-down grayed out and with the additional text "sold out". This was possible through a Woocommerce hook. But I had to disable the Woocommerce checkbox to "hide out-of-stock items from the catalog", because otherwise the out-of-stock variations would be hidden completely from the drop-down.

The problem: Products with out-of-stock variations are still shown in archives (shop page, categories, attribute archives, search results) and this is not desired. So the only possibility might be to "hide out-of-stock items from the catalog" and still display the out-of-stock variations in the dropdown.

I tried to overwrite the WooCommerce wc_dropdown_variation_attribute_options() function to modify the select options. The <options> there are populated by the $terms variable. When I var_dump() this variable right before the <select>, I see that all attributes are in place (visible and invisible ones). But they are hidden from the HTML, obviously by AJAX. How can I make them visible?

CodePudding user response：

function woocommerce_hide_out_of_stock_items( $pre_option ) {
    
    // Disable hide option dynamicaly on product page only
    if(is_product()){
        return 'no';
    }

    return $pre_option;
}
add_filter( 'pre_option_woocommerce_hide_out_of_stock_items', 'woocommerce_hide_out_of_stock_items' );