所有 WooCommerce 结帐字段的自定义占位符

Posted 2023-02-22

【中文标题】所有 WooCommerce 结帐字段的自定义占位符

【英文标题】：Custom placeholder for all WooCommerce checkout fields

【发布时间】：2018-03-01 18:49:30

【问题描述】：

我正在尝试在我的 WooCommerce 结帐字段中添加一个占位符，它对 除了电话和电子邮件 字段之外的每个字段都非常有效。

这是我正在使用的代码：

add_filter('woocommerce_default_address_fields', 'override_address_fields');
function override_address_fields( $address_fields ) 
    $address_fields['first_name']['placeholder'] = 'Fornavn';
    $address_fields['last_name']['placeholder'] = 'Efternavn';
    $address_fields['address_1']['placeholder'] = 'Adresse';
    $address_fields['state']['placeholder'] = 'Stat';
    $address_fields['postcode']['placeholder'] = 'Postnummer';
    $address_fields['city']['placeholder'] = 'By';
    $address_fields['phone']['placeholder'] = 'Telefon';
    $address_fields['email']['placeholder'] = 'Email';
    return $address_fields;

我哪里错了？为什么电话和电子邮件没有任何结果？

我使用浏览器开发工具检查器从这两个字段中获取了 ID。

---

编辑：

我也试过这个建议的代码：

add_filter('woocommerce_checkout_fields', 'override_checkout_fields');
function override_checkout_fields( $checkout_fields ) 
    $checkout_fields['first_name']['placeholder'] = 'Fornavn';
    $checkout_fields['last_name']['placeholder'] = 'Efternavn';
    $checkout_fields['address_1']['placeholder'] = 'Adresse';
    $checkout_fields['state']['placeholder'] = 'Stat';
    $checkout_fields['postcode']['placeholder'] = 'Postnummer';
    $checkout_fields['city']['placeholder'] = 'By';
    $checkout_fields['phone']['placeholder'] = 'Telefon';
    $checkout_fields['email']['placeholder'] = 'Email';
    return $checkout_fields;

还有这个：

add_filter('woocommerce_checkout_fields', 'override_checkout_fields');
function override_checkout_fields( $checkout_fields ) 
    $checkout_fields['billing_first_name']['placeholder'] = 'Fornavn';
    $checkout_fields['billing_last_name']['placeholder'] = 'Efternavn';
    $checkout_fields['billing_address_1']['placeholder'] = 'Adresse';
    $checkout_fields['billing_state']['placeholder'] = 'Stat';
    $checkout_fields['billing_postcode']['placeholder'] = 'Postnummer';
    $checkout_fields['billing_city']['placeholder'] = 'By';
    $checkout_fields['billing_phone']['placeholder'] = 'Telefon';
    $checkout_fields['billing_email']['placeholder'] = 'Email';
    return $checkout_fields;

但它不起作用。

【问题讨论】：

您好，我有一个关于您的问题的有效测试答案，请尝试一下。应该感谢一些反馈。谢谢

嗨@LoicTheAztec 很好的答案，谢谢。现在，如何自定义登录字段中的占位符？ $fields['account']['account_username']['placeholder'] = __( 'Email*', 'woocommerce' );应该使用过滤器woocommerce_checkout_fields...但它没有。

其实问题已经发在这里了：***.com/questions/57340779/…你能在那里给我们答案吗？

@Louis 您的回答无法在我的帐户登录表单上使用...我已经回答...您可以查看它，如果您喜欢/想要，您可以为答案投票。

【参考方案1】：

查看official docs，您会看到没有使用woocommerce_default_address_fields过滤器时默认地址的'phone'和'email'关键字段钩。 接受的字段键是：country、first_name、last_name、company、address_1、address_2、city、state、postcode。

这就是您可以使用 woocommerce_default_address_fields

进行更改的原因

电子邮件和电话是 计费 字段，它们可通过 woocommerce_checkout_fields 过滤器挂钩使用。它们被命名为（参见文档）'billing_phone' 和 'billing_phone'...

覆盖它们的正确方法是：

add_filter( 'woocommerce_checkout_fields' , 'override_billing_checkout_fields', 20, 1 );
function override_billing_checkout_fields( $fields ) 
    $fields['billing']['billing_phone']['placeholder'] = 'Telefon';
    $fields['billing']['billing_email']['placeholder'] = 'Email';
    return $fields;

对于其他字段（账单和运输）：

add_filter('woocommerce_default_address_fields', 'override_default_address_checkout_fields', 20, 1);
function override_default_address_checkout_fields( $address_fields ) 
    $address_fields['first_name']['placeholder'] = 'Fornavn';
    $address_fields['last_name']['placeholder'] = 'Efternavn';
    $address_fields['address_1']['placeholder'] = 'Adresse';
    $address_fields['state']['placeholder'] = 'Stat';
    $address_fields['postcode']['placeholder'] = 'Postnummer';
    $address_fields['city']['placeholder'] = 'By';
    return $address_fields;

代码进入您的活动子主题（或主题）的 function.php 文件或任何插件文件中。

所有代码都在 Woocommerce 3+ 上进行了测试并且可以运行。

---

参考：Customizing checkout fields using actions and filters

---

对于登录表单字段：Customize WooCommerce login form user fields

【讨论】：

这就是解决方案！你太棒了，非常感谢。对于有相同问题的每个人都可以试试这个。

但是如果你想要一个像 ADDRESS_1 这样的地址字段，我想不出来。您将所需的点放在哪里。

@amirhanif 您可能会寻找 $address_fields['address_1']['required'] = true; 放置在第二个挂钩函数中（在此答案代码中）。

这个答案有误。如果要替换电子邮件占位符，请使用 $fields['billing']['billing_email']['placeholder'] 而不是 $fields['billing']['billing_phone']['placeholder']

@Laurent 刚刚改变了……抱歉。

【参考方案2】：

根据官方文档https://docs.woocommerce.com/document/tutorial-customising-checkout-fields-using-actions-and-filters/ 这里有更新的代码：

 add_filter( 'woocommerce_checkout_fields' , 'override_billing_checkout_fields', 20, 1 );
 function override_billing_checkout_fields( $fields ) 

     $fields['billing']['billing_first_name']['placeholder'] = 'Prénom';
     $fields['billing']['billing_last_name']['placeholder'] = 'Nom';
     $fields['billing']['billing_company']['placeholder'] = 'Nom de la société (optionnel)';
     $fields['billing']['billing_postcode']['placeholder'] = 'Code postal';
     $fields['billing']['billing_phone']['placeholder'] = 'Téléphone';
     $fields['billing']['billing_city']['placeholder'] = 'Ville';


     $fields['shipping']['shipping_first_name']['placeholder'] = 'Prénom';
     $fields['shipping']['shipping_last_name']['placeholder'] = 'Nom';
     $fields['shipping']['shipping_company']['placeholder'] = 'Nom de la société (optionnel)';
     $fields['shipping']['shipping_postcode']['placeholder'] = 'Code postal';
     $fields['shipping']['shipping_phone']['placeholder'] = 'Téléphone';
     $fields['shipping']['shipping_city']['placeholder'] = 'Ville';

     return $fields;
 

结果：

【参考方案3】：

查看WooCommerce documentation，您可能想尝试使用woocommerce_checkout_fields 过滤器而不是woocommerce_default_address_fields

似乎更合乎逻辑，因为上面的字段并不全都与地址相关，并且该挂钩源自class-wc-countries.php。

另外，请注意字段名称根据页面的上下文而有所不同，例如，帐单页面字段的命名如下：

billing_first_name billing_last_name billing_email billing_phone

希望对您有所帮助！祝你好运。

【讨论】：

非常感谢您的帮助！我一开始尝试了这个，但是它只是没有给它们添加任何占位符。我做错了吗？我用代码编辑了你的 psot。

@eMikkelsen 我已经编辑了我原来的答案，应该就是这样。

感谢您仍然提供帮助。刚刚也尝试了上面的代码，更改这些字段添加 billing_ 也无济于事。我已在顶部的编辑中附加了完整的代码。