在X按钮下添加自定义文本，以从购物车中删除商品 [英] Adding a custom text under the X button that removes items from cart

问题描述

使用Wordpress和WooCommerce，我试图在购物车中的 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.

我试图检查元素以找到此 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?

谢谢。

推荐答案

这个小小的交叉文本图标位于> WooCommerce模板 cart / cart.php 和 cart / mini-cart.php 。但是，您可以使用专用的 woocommerce_cart_item_remove_link 过滤器挂钩来替代此模板，以实现所需的功能。

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.

这是经过测试的有效代码，将在红十字购物车图标下方添加删除项目 ：

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;
};

代码会进入您的活动子主题（或主题）的function.php文件中，或者

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

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.

这篇关于在X按钮下添加自定义文本，以从购物车中删除商品的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！