Question

我希望WooCommerce在使用移动设备时能更好地处理“数量”字段输入。我希望移动浏览器不显示完整的键盘供用户输入数量字段，而是显示数字键盘。

我可以通过修改

中的quantity-input.php来实现

pattern="<?php echo esc_attr( $pattern ); ?>"
inputmode="<?php echo esc_attr( $inputmode ); ?>"

到

pattern="[0-9]*"
inputmode="numeric"

在

wp-content/plugins/woocommerce/templates/global/quantity-input.php

但是显然直接修改WooCommerce的php文件是一个糟糕的主意，因此我需要一些有关此类修改的最佳实践的指导。

我一直在Wordpress中使用名为Code Snippet的插件，并且效果很好。如何使用该代码将代码放入我的网站？

我发现有一篇文章提到使用过滤器here在WooCommerce中覆盖了模板文件，但是我对此并不熟悉，因为我是Wordpress / WooCommerce的新手

使用过滤器wc_get_template_part和/或woocommerce_locate_template似乎是可行的方法，但我不知道该怎么做。

欢迎任何建议。

Answer 1

您可以简单地使用woocommerce_quantity_input_args专用过滤器挂钩，例如：

add_filter( 'woocommerce_quantity_input_args', 'filter_quantity_input_args_callback', 10, 2 );
function filter_quantity_input_args_callback( $args, $product ) {
    $args['pattern']   = '[0-9]*';
    $args['inputmode'] = 'numeric';

    return $args;
}

代码进入您的活动子主题（或活动主题）的function.php文件中。经过测试，可以正常工作。

或者这是两个过滤器钩子（效果相同）：

add_filter( 'woocommerce_quantity_input_pattern', 'filter_quantity_input_pattern_callback', 10, 1 );
function filter_quantity_input_pattern_callback( $input_pattern ) {
    return '[0-9]*';
}

add_filter( 'woocommerce_quantity_input_inputmode', 'filter_quantity_input_inputmode_callback', 10, 1 );
function filter_quantity_input_inputmode_callback( $inputmode ) {
    return 'numeric';
}

代码进入您的活动子主题（或活动主题）的function.php文件中。经过测试，可以正常工作。

覆盖WooCommerce全局模板quantity-input.php，以在移动设备上提供更好的数量输入体验

1 个答案: