在X按钮下添加自定义文本，从购物车中删除商品

With Wordpress and WooCommerce, I am trying to add a custom text "delete item" under the "x" in the shopping cart tthat removes items from cart.

使用Wordpress和WooCommerce，我试图在购物车中的“x”下添加自定义文本“删除项目”，以便从购物车中删除商品。

I tried to "inspect element" to find where this "x" text icon was located, but I am hitting a brick wall.

我试图“检查元素”以找到这个“x”文本图标所在的位置，但我正在撞墙。

Any suggestions on how I can find this, and amend the "x" button to include text underneath?

有关如何找到这个的任何建议，并修改“x”按钮以包含下面的文本？

Thanks.

谢谢。

2 个解决方案

#1

add_filter('woocommerce_cart_item_remove_link', 'remove_icon_and_add_text', 10, 2);

function remove_icon_and_add_text($string, $cart_item_key) {
    $string = str_replace('class="remove"', '', $string);
    return str_replace('&times;', 'Delete Item', $string);
}

Please try below code snippet in your active theme's functions.php

请在活动主题的functions.php中尝试以下代码段

#2

This little cross text icon is located on the WooCommerce templates cart/cart.php and cart/mini-cart.php. But instead overriding this templates, you can use the dedicated woocommerce_cart_item_remove_link filter hook, to achieve what you want to do.

这个小十字文本图标位于WooCommerce模板cart / cart.php和cart / mini-cart.php中。但是，改为覆盖此模板，您可以使用专用的woocommerce_cart_item_remove_link过滤器钩子来实现您想要做的事情。

Here is a working tested code that will add 'Delete item' below the red cross cart icon:

这是一个经过测试的代码，它将在红色交叉购物车图标下方添加“删除项目”：

add_filter( 'woocommerce_cart_item_remove_link', 'custom_filter_wc_cart_item_remove_link', 10, 2 );
function custom_filter_wc_cart_item_remove_link( $sprintf, $cart_item_key ) {

    if ( is_admin() && ! defined( 'DOING_AJAX' ) )
        return $sprintf;

    // HERE Define your additional text
    $add_text = __('Delete item', 'woocommerce');

    // HERE Define the style of the text
    $styles = 'font-size:0.8em; display:block;';

    $sprintf = str_replace('</a>', '</a><span class="remove-text" style="'.$styles.'">'.$add_text.'</span>', $sprintf);

    return $sprintf;
};

Code goes in function.php file of your active child theme (or theme) or also in any plugin file.

代码放在活动子主题（或主题）的function.php文件中，或者放在任何插件文件中。

You will may be need to add some CSS styles for the red cross icon using
.woocommerce a.remove CSS selector in the slyle.css file of your active theme.

您可能需要使用活动主题的slyle.css文件中的.woocommerce a.remove CSS选择器为红叉图标添加一些CSS样式。

#1

add_filter('woocommerce_cart_item_remove_link', 'remove_icon_and_add_text', 10, 2);

function remove_icon_and_add_text($string, $cart_item_key) {
    $string = str_replace('class="remove"', '', $string);
    return str_replace('&times;', 'Delete Item', $string);
}