Home > Back-end >  Extra HTML for shipping methods in WooCommerce cart and checkout
Extra HTML for shipping methods in WooCommerce cart and checkout

Time:11-03

I am trying to tack on estimated arrival times to the labels of my shipping methods. However, I'd like the arrival times to have some bonus HTML within the label. (Make them smaller and different font-weight).

Here is a simple example:

function add_estimated_arrival_times($rates, $package){
    
    $groundStuff = $timeReturnedFromAPI; //collect a bunch of cart information, post to the UPS API, return estimated arrival time to $timeReturnedFromAPI
    $ground_rate_id = 'ups:6:09'; //UPS ground rate ID
    
    // Loop through available shipping rates, add arrival time if rate is UPS ground
    foreach ( $rates as $rate_key => $rate ) {
        if( $ground_rate_id === $rate_key ) {
            $rates[$rate_key]->label .= ' <span style="font-size: 12px; font-weight: normal;">(' . $groundStuff . ')</span>'; //<---- problem: HTML is not added
            break;
        }
    }

    return $rates;
}
add_filter( 'woocommerce_package_rates','add_estimated_arrival_times', 50, 2 );

The code above successfully adds the plain text to the shipping method label, but the HTML disappears.

What would be a good workaround for this?

CodePudding user response:

The hook you are using only allows you to edit the text:

function filter_woocommerce_package_rates( $rates, $package ){    
    // Loop through available shipping rates
    foreach ( $rates as $rate_key => $rate ) {
        $rates[$rate_key]->label = __( 'My label', 'woocommerce' );
    }

    return $rates;
}
add_filter( 'woocommerce_package_rates','filter_woocommerce_package_rates', 10, 2 );

So if you want to add something after the label you can do this via the woocommerce_after_shipping_rate hook

function action_woocommerce_after_shipping_rate( $method, $index ) {
    // Target a specific method ID
    if ( $method->id == 'local_pickup:1' ) {
        echo '<p>test</p>';
    } else {
        $groundStuff = 'some value';
        
        echo '<span style="font-size: 12px; font-weight: normal;">(' . $groundStuff . ')</span>';
    }
}
add_action( 'woocommerce_after_shipping_rate', 'action_woocommerce_after_shipping_rate', 10, 2 );

OR

By overwriting /cart/cart-shipping.php at line 40 @version 3.6.0 - This template can be overridden by copying it to yourtheme/woocommerce/cart/cart-shipping.php

  • Related