Shipping methods in dropdown instead of radio buttons [closed]

by

I’m sure you’re not still looking for an answer, as this was almost to the day 1 year ago, but for anyone else who comes across this like me on a google search, trying to find a good solution that does not require the use of another plugin, here is the working solution.

echo 1 < count( $available_methods ) ? '<select id="shipping_method_0" data-index="0" name="shipping_method[0]" class="woocommerce-shipping-methods shipping_method">' : ''; 
    foreach ( $available_methods as $method ) : 
        if ( 1 < count( $available_methods ) ) {
            printf( '<option id="shipping_method_%1$d_%2$s" value="%3$s" %4$s >%5$s</option>', $index, esc_attr( sanitize_title( $method->id ) ), esc_attr( $method->id ), ( $method->id == $chosen_method ? "selected" : "" ), wc_cart_totals_shipping_method_label( $method ) ); // WPCS: XSS ok.
        } else {
            printf( '<input type="hidden" name="shipping_method[%1$d]" data-index="%1$d" id="shipping_method_%1$d_%2$s" value="%3$s" class="shipping_method" />', $index, esc_attr( sanitize_title( $method->id ) ), esc_attr( $method->id ) ); // WPCS: XSS ok.
        }
        do_action( 'woocommerce_after_shipping_rate', $method, $index );
    endforeach; 
echo 1 < count( $available_methods ) ? '</select>' : '';

A couple things to note in how my solution here fixes some of the problems with OP’s original attempt:

  1. I made the main container only added if there is more than one available shipping methods, as otherwise this would create an HTML error when the code tries to output the hidden field for shipping method.
  2. You need to apply the id, data-index, name and class to the field in order for all of the calculations to work, including marking this as if it were the first in an array of options, like the radios, by adding the 0 index to the name, data-index and id.
  3. You need to replace the checked() function with a simple if statement checking if the $chosen_method matches the current $method->id, and if it does add the selected attribute.

I hope this helps anyone who finds this in the future!