如何编辑帐单详细信息 WooCommerce 结帐页面
已发表: 2021-02-22您可以通过多种方式在 WooCommerce 中编辑帐单详细信息。 在本教程中,我想强调您可以编辑帐单详细信息以删除字段或删除要求的方式。
在上一篇文章中,我分享了如何在结帐页面禁用 Zip/Postal Code 字段或如何删除 Zip/Postal code 验证。
如何编辑帐单详细信息 WooCommerce(删除字段、禁用验证、添加自定义占位符和添加自定义表单标签)
今天,我想向您展示如何编辑帐单详细信息并删除您不希望向客户显示的字段。
WooCommerce 使用免费插件编辑帐单详细信息
您可以使用十几个免费和高级插件来编辑 WooCommerce 计费详细信息。
这些插件中的每一个都具有独特的功能和界面设计。 在 WooCommerce 中编辑帐单详细信息的最佳免费插件是 WooCommerce 的结帐字段编辑器(结帐管理器)。
此插件允许您在 WooCommerce 结帐时编辑核心计费、运输和附加字段。
在编辑表单中,您可以添加自定义字段选项,例如:名称、类型、标签、占位符、类、标签类、验证规则等(这些选项的可用性可能会根据字段类型而变化)。
WooCommerce 使用代码片段编辑帐单详细信息
您还可以通过将代码片段添加到主题的functions.php文件来编辑 WooCommerce 结帐页面上的帐单详细信息。
删除 WooCommerce Checkout 帐单字段
首先,您可以使用以下代码段删除您不喜欢的计费字段:
/** *编辑帐单详细信息以删除您不想要的字段 **/ 功能 njengah_remove_checkout_fields( $fields ) { // 计费字段 未设置($fields['billing']['billing_company']); 未设置($fields['billing']['billing_email']); 未设置($fields['billing']['billing_phone']); 未设置($fields['billing']['billing_state']); 未设置($fields['billing']['billing_first_name']); 未设置($fields['billing']['billing_last_name']); 未设置($fields['billing']['billing_address_1']); 未设置($fields['billing']['billing_address_2']); 未设置($fields['billing']['billing_city']); 未设置($fields['billing']['billing_postcode']); 返回$字段; } add_filter('woocommerce_checkout_fields', 'njengah_remove_checkout_fields');
您可以删除所有字段并添加自定义字段,也可以从您想要保留的那些下方的代码段中删除。
这是在不使用插件的情况下从 WooCommerce 结帐页面中删除帐单字段的最快方法。
例如,如果我们只想在账单明细上显示名字、姓氏和电子邮件,我们可以将代码更改为如下代码片段所示:
功能 njengah_remove_checkout_fields_keep_email_name( $fields ) { // 计费字段 未设置($fields['billing']['billing_company']); 未设置($fields['billing']['billing_phone']); 未设置($fields['billing']['billing_state']); 未设置($fields['billing']['billing_address_1']); 未设置($fields['billing']['billing_address_2']); 未设置($fields['billing']['billing_city']); 未设置($fields['billing']['billing_postcode']); 返回$字段; } add_filter('woocommerce_checkout_fields','njengah_remove_checkout_fields_keep_email_name');
删除 WooCommerce Checkout 账单字段和运输字段
您还可以扩展此逻辑以删除运输字段以及帐单字段。 将删除帐单字段和运输字段的完整代码如下:
功能 njengah_remove_checkout_fields_billing_shipping($fields){ // 计费字段 未设置($fields['billing']['billing_company']); 未设置($fields['billing']['billing_email']); 未设置($fields['billing']['billing_phone']); 未设置($fields['billing']['billing_state']); 未设置($fields['billing']['billing_first_name']); 未设置($fields['billing']['billing_last_name']); 未设置($fields['billing']['billing_address_1']); 未设置($fields['billing']['billing_address_2']); 未设置($fields['billing']['billing_city']); 未设置($fields['billing']['billing_postcode']); // 运输字段 未设置($fields['shipping']['shipping_company']); 未设置($fields['shipping']['shipping_phone']); 未设置($fields['shipping']['shipping_state']); 未设置($fields['shipping']['shipping_first_name']); 未设置($fields['shipping']['shipping_last_name']); 未设置($fields['shipping']['shipping_address_1']); 未设置($fields['shipping']['shipping_address_2']); 未设置($fields['shipping']['shipping_city']); 未设置($fields['shipping']['shipping_postcode']); 返回$字段; } add_filter('woocommerce_checkout_fields','njengah_remove_checkout_fields_billing_shipping');
删除 WooCommerce Checkout 账单字段、运输字段和订单备注
您还可以使用相同的逻辑删除位于计费部分和运输部分下方的订单备注字段,但添加order_comments
删除选项,如下面的组合代码片段所示:
功能 njengah_remove_checkout_fields_billing_shipping_order( $fields ) { // 计费字段 未设置($fields['billing']['billing_company']); 未设置($fields['billing']['billing_email']); 未设置($fields['billing']['billing_phone']); 未设置($fields['billing']['billing_state']); 未设置($fields['billing']['billing_first_name']); 未设置($fields['billing']['billing_last_name']); 未设置($fields['billing']['billing_address_1']); 未设置($fields['billing']['billing_address_2']); 未设置($fields['billing']['billing_city']); 未设置($fields['billing']['billing_postcode']); // 运输字段 未设置($fields['shipping']['shipping_company']); 未设置($fields['shipping']['shipping_phone']); 未设置($fields['shipping']['shipping_state']); 未设置($fields['shipping']['shipping_first_name']); 未设置($fields['shipping']['shipping_last_name']); 未设置($fields['shipping']['shipping_address_1']); 未设置($fields['shipping']['shipping_address_2']); 未设置($fields['shipping']['shipping_city']); 未设置($fields['shipping']['shipping_postcode']); // 订单字段 未设置($fields['order']['order_comments']); 返回$字段; } add_filter('woocommerce_checkout_fields','njengah_remove_checkout_fields_billing_shipping_order');
WooCommerce 编辑帐单详细信息要求或验证
当其中一个帐单字段未填写时,WooCommerce 会生成一个错误,就像最常见的错误一样——帐单邮政编码不是有效的邮政编码/邮政编码。
这是因为默认情况下 WooCommerce 计费结帐字段上有一个验证功能。
要解决此问题并避免在该字段留空时显示这些错误,您需要删除帐单详细信息验证。
下面的代码片段将从计费电话字段中删除验证,此代码应添加到活动主题的 functions.php 文件中。
/** * 删除计费字段验证的示例 **/ add_filter('woocommerce_billing_fields', 'njengah_remove_phone_field_validation'); 功能 njengah_remove_phone_field_validation( $fields ) { $fields['billing_phone']['required'] = false; 返回$字段; }
您可以将此逻辑扩展到更多字段,例如姓名、电子邮件等。 您只需将以下代码行替换为要从中删除验证的字段的字段 ID。
$fields['billing_phone']['required'] = false;
WooCommerce 编辑帐单详细信息占位符和标签
编辑 WooCommerce 计费详细信息的另一种方法是更改默认的 WooCommerce 结帐页面表单标签和占位符。 您可以使用下面的代码片段来实现这一点:
add_filter('woocommerce_checkout_fields', 'njengah_edit_checkout_placeholders_labels'); 功能 njengah_edit_checkout_placeholders_labels($fields){ $fields['billing']['billing_company']['placeholder'] = '自定义占位符'; $fields['billing']['billing_company']['label'] = '自定义标签'; 返回$字段; }
结论
在本教程中,我们重点介绍了您可以编辑 WooCommerce 计费详细信息以自定义 WooCommerce 结帐页面以满足您的需求的各种方法。 重要的是要记住,这些代码片段的工作方式与插件编辑帐单详细信息、运输详细信息和订单说明的工作方式相同。
还建议您始终将这些代码片段添加到活动主题的子主题中。 如果您没有子主题,您可以使用这篇文章了解如何创建子主题 – 创建 Storefront 子主题。
自定义 WooCommerce 有多种方法,但最常见的是隐藏您不喜欢的功能,我分享了有关如何隐藏 WooCommerce 商店中大多数功能的综合指南,Ultimate WooCommerce 隐藏指南。 这可能是让您开始使用 WooCommerce 定制的好地方。
如果您使用的是 WooCommerce 默认主题 – Storefront 主题,您可以从 80 多个 Storefront 自定义提示中学习如何使您的 WooCommerce 商店具有专业的外观和感觉。
最后,如果您需要聘请 WordPress 专家或 WooCommerce 开发人员,我随时可以帮助您解决任何 WooCommerce 问题或修复您网站上的任何错误。
类似文章
- 如何在 WooCommerce 结帐页面上添加隐藏字段
- 在 WooCommerce 中结帐后如何获取订单详细信息
- 在 WooCommerce 中缺货时如何隐藏价格
- 如何在 WooCommerce 中注销时清除购物车
- 如何从结帐 WooCommerce 中删除电话号码字段
- 如何从 WooCommerce 结帐中删除帐单详细信息
- 如何设置 WooCommerce 结帐页面的样式
- 如何在 WooCommerce 中的结帐页面或订单页面上获取产品 ID
- WooCommerce 钩子列表 » 全球、购物车、结帐、产品
- 如何修复帐单邮政编码不是有效的邮政编码/邮政编码
- 如何在 WordPress (PHP) 中使用 do_shortcode
- WooCommerce 隐藏附加信息结帐
- 如何获取 WooCommerce 结帐国家/地区下拉菜单
- 如何添加 WooCommerce Checkout 默认国家
- 如何更改结帐端点 WooCommerce
- 如何检查它是否是结帐页面 WooCommerce
- 如何删除产品类别标题 WooCommerce
- 如何在结帐页面 WooCommerce 上获取订单 ID
- 如何在 WooCommerce 中以编程方式将产品添加到购物车