将自定义图标添加到 Woocommerce Cart 和 Checkout 中的运输选项 [英] Adding custom icons to the shipping options in Woocommerce Cart and Checkout

问题描述

我想在 Woocommerce Cart 和 Checkout 的送货选项中添加图标.

例如在本地取货"选项中，我想在选项旁边显示一个小商店图标，如下所示:

我只想在特定的本地取件选项中显示图标.

解决方案

使用 woocommerce_cart_shipping_method_full_label 过滤器.

add_filter( 'woocommerce_cart_shipping_method_full_label', 'filter_woocommerce_cart_shipping_method_full_label', 10, 2 );函数 filter_woocommerce_cart_shipping_method_full_label( $label, $method ) {//使用这里的条件和 $method 将图像应用于特定方法.if( $method->method_id == "flat_rate" ) {$label = $label."你的图标图片";} else if( $method->method_id == "local_pickup" ) {$label = $label."你的图标图片";}返回 $label;}

I want to add icons to the shipping options in Woocommerce Cart and Checkout.

For example in the "local pickup" option I want to show a little store icon beside the option just like this: https://ibb.co/jz0jJgk

I tried to do add this code in the title of the "local pickup" option in the Woocommerce>settings>shipping options but it doesn't show the custom store icon that I have.

Local Pickup <img src="examplesite.com/media/store_icon.png" alt="local store icon">

If this is possible... what code do I need to add at functions.php or in which file?

Thank you for reading.

UPDATE:

So far I have been using this (a useful tip provided by @Jainil)

add_filter( 'woocommerce_cart_shipping_method_full_label', 'filter_woocommerce_cart_shipping_method_full_label', 10, 2 ); 

function filter_woocommerce_cart_shipping_method_full_label( $label, $method ) { 
        $shipping_method_id = ['flat_rate:19'];
        $label .= 'class="shipping_method"'('<img src="https://site.local/wp-content/uploads/2019/10/icon_store.png">', 'woocommerce');// Use the condition here with $method to apply the image to a specific method.      

    return $label; 
}

But it shows the icon in every shipping option available https://ibb.co/9ZJKVB8

I just want to show the icon in specific Local Pickup option.

解决方案

Use the woocommerce_cart_shipping_method_full_label filter.

add_filter( 'woocommerce_cart_shipping_method_full_label', 'filter_woocommerce_cart_shipping_method_full_label', 10, 2 ); 

function filter_woocommerce_cart_shipping_method_full_label( $label, $method ) { 
   // Use the condition here with $method to apply the image to a specific method.      

   if( $method->method_id == "flat_rate" ) {
       $label = $label."Your Icon Image";
   } else if( $method->method_id == "local_pickup" ) {
       $label = $label."Your Icon Image";       
   }
   return $label; 
}

这篇关于将自定义图标添加到 Woocommerce Cart 和 Checkout 中的运输选项的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！