外贸网站为何需要隐藏价格与购买功能?
许多外贸类独立站(B2B)并不直接在线销售,而是以获取询盘(Leads)为主要目的。在这种情况下,展示商品价格、库存数量以及“加入购物车”按钮反而会干扰客户的询盘意图,甚至可能因为公开报价而影响后续的议价流程。因此,隐藏这些销售元素,将页面焦点引导至“询盘”或“联系我们”按钮,是更符合业务需求的设置。
方法一:通过代码隐藏价格与购买按钮(推荐)
将以下代码添加到您当前 WordPress 主题的 functions.php 文件末尾。这是最灵活且更新安全的方法。
/**
* 隐藏WooCommerce商品价格
*/
add_filter( 'woocommerce_get_price_html', 'custom_hide_price' );
function custom_hide_price( $price ) {
// 返回空字符串即可在前端隐藏所有价格显示
return '';
}
/**
* 隐藏WooCommerce“加入购物车”按钮
*/
add_action( 'init', 'custom_hide_add_to_cart_button' );
function custom_hide_add_to_cart_button() {
// 移除商品列表页的按钮
remove_action( 'woocommerce_after_shop_loop_item', 'woocommerce_template_loop_add_to_cart', 10 );
// 移除商品详情页的按钮
remove_action( 'woocommerce_single_product_summary', 'woocommerce_template_single_add_to_cart', 30 );
// 可选:移除其他可能的位置,如商品摘要下方
// remove_action( 'woocommerce_simple_add_to_cart', 'woocommerce_simple_add_to_cart', 30 );
}
代码说明:
woocommerce_get_price_html过滤器:用于修改价格显示的HTML,返回空字符串即可隐藏。init动作钩子:在WordPress初始化时执行,安全地移除“加入购物车”按钮的渲染动作。- 使用自定义函数名(如
custom_hide_price)可以避免与未来插件更新产生冲突。
注意事项
- 修改主题文件前,请务必创建子主题或备份原文件。
- 代码生效后,价格和按钮将从网站前端(包括列表页、详情页)消失,但后台管理界面不受影响。
方法二:隐藏商品数量输入框
“数量”输入框通常出现在商品详情页。要隐藏它,最推荐的方法是使用CSS,避免直接修改核心模板文件。
通过CSS隐藏
在WordPress后台的 外观 → 自定义 → 额外CSS 中添加以下代码:
/* 隐藏商品详情页的数量输入框 */
.quantity, .qty {
display: none !important;
}
/* 同时隐藏其标签(可选) */
label[for="quantity"] {
display: none !important;
}
此方法简单快捷,且不会因WooCommerce更新而失效。
不推荐:修改模板文件(旧方法)
早期教程可能建议找到 quantity-input.php 模板文件并注释代码。但强烈不推荐此方法,因为:
- 直接修改插件核心文件会在更新时被覆盖。
- 模板文件路径和结构可能随版本变化。
- 使用CSS或上述代码钩子是更专业和可维护的做法。
完整方案与最佳实践
对于典型的外贸询盘站点,建议按以下步骤操作:
- 使用代码(方法一):隐藏所有价格和“加入购物车”按钮。
- 使用CSS(方法二):隐藏数量输入框。
- 强化询盘引导:在原来按钮的位置,通过WooCommerce Hook或页面编辑器,添加一个醒目的“获取报价”或“联系我们”按钮,链接到联系表单。
- 测试验证:清除网站缓存后,检查商品列表页、详情页,确保目标元素已隐藏,且网站其他功能正常。
通过以上组合方案,您可以快速将WooCommerce商店转换为一个专业的B2B产品展示与询盘收集平台,更好地服务于外贸业务。
您好,请问woocommerce 有add to cart 后来自己做了一个popup看效果不好删除了popup,再添加add to cart 显示灰色添加不了,请大神指教是什么原因?
估计是样式标签的问题,必须和原来一致