自定义 Woocommerce 模板 my-account/form-edit-addresses

Question

/my-account/edit-addresses/

的地址区有一些问题

我想自定义模板中的表单域 form-edit-addresses.php。例如，我想更改所有字段，并单独将一些字段放在单独的类:

<p class="form-row form-row-first validate-required" id="billing_first_name_field" data-priority="10">
<label for="billing_first_name" class="">First name <abbr class="required" title="required">*</abbr></label>
<input type="text" class="input-text " name="billing_first_name" id="billing_first_name" placeholder="" value="Name"></p>

到

<div class="form-group form-group-default input-group">
<div class="form-input-group">
<label for="billing_first_name" class="">Company</label>
<input type="text" class="input-text " name="billing_first_name" id="billing_first_name" placeholder="" value="Name">
</div>

请注意，以上这些只是从检查中提取的 HTML 标签，并不是使表单正常工作的正确字段。我可以处理 - 它只是查找或替换字段。

我想完成的第二件事是在 /my-account/edit-addresses/ URL/Slug 而不是 /my-account/edit-addresses/billing
第三种是在提交时将表单重定向到 /my-account/ 而不是 /my-account/edit-addresses/ 并包含任何 Woocommerce 通知
最后一点是删除First Name Last Name Email Phone 字段。我认为通过完成第 1 步并删除不需要的表单字段可以轻松解决问题。

非常感谢您花时间寻找这些问题的解决方案。

干杯

Answer 1

我已经弄清楚了我的问题的第 2、3 和 4 部分 - 以防万一有人在看...

第 2 部分是将 form-edit-address.php 添加到 edit-address

我将其添加到 my-address.php 模板

<?php
// get the user meta
$userMeta = get_user_meta(get_current_user_id());

// get the form fields
$countries = new WC_Countries();
$billing_fields = $countries->get_address_fields( '', 'billing_' );
$shipping_fields = $countries->get_address_fields( '', 'shipping_' );
?>

<!-- billing form -->
<?php
$load_address = 'billing';
$page_title   = __( 'Billing Address', 'woocommerce' );
?>
<form action="/my-account/edit-address/billing/" class="edit-account" method="post">

    <h2><?php echo apply_filters( 'woocommerce_my_account_edit_address_title', $page_title ); ?></h2>

    <?php do_action( "woocommerce_before_edit_address_form_{$load_address}" ); ?>

    <?php foreach ( $billing_fields as $key => $field ) : ?>

        <?php woocommerce_form_field( $key, $field, $userMeta[$key][0] ); ?>

    <?php endforeach; ?>

    <?php do_action( "woocommerce_after_edit_address_form_{$load_address}" ); ?>

    <p>
        <input type="submit" class="button" name="save_address" value="<?php esc_attr_e( 'Save Address', 'woocommerce' ); ?>" />
        <?php wp_nonce_field( 'woocommerce-edit_address' ); ?>
        <input type="hidden" name="action" value="edit_address" />
    </p>

</form>

要完成第 3 部分并从 form-edit-address.php 重定向提交，我将以下内容添加到我的主题 functions.php

function action_woocommerce_customer_save_address( $user_id, $load_address ) { 
   wp_safe_redirect(wc_get_page_permalink('myaccount')); 
   exit;
}; 
add_action( 'woocommerce_customer_save_address', 'action_woocommerce_customer_save_address', 99, 2 );

为了完成第 4 部分并从 form-edit-address.php 中删除字段，我将以下内容添加到我的主题中 functions.php

add_filter( 'woocommerce_billing_fields' , 'custom_override_billing_fields' );

function custom_override_billing_fields( $fields ) {
  unset($fields['billing_first_name']);
  unset($fields['billing_last_name']);
  unset($fields['billing_phone']);
  unset($fields['billing_email']);
  return $fields;
}

如果您对此问题的其他部分有任何帮助，我们将不胜感激。

Answer 2

您不能将 <p> 标签（删除所有现有属性 + 值）更改为 <div>，因为这肯定会破坏某些进程，因为在此启用了特定的 woocommerce javascript …

现在您可以使用 woocommerce_form_field_args 过滤器挂钩在所有 <p> 标签，您也可以删除所有字段上的 required 行为，因此 <abbr class="required" title="required">*</abbr> 将被删除。

代码如下：

add_filter( 'woocommerce_form_field_args', 'custom_wc_form_field_args', 10, 3 );
function custom_wc_form_field_args( $args, $key, $value ){
    // Only on My account > Edit Adresses
    if( is_wc_endpoint_url( 'edit-account' ) || is_checkout() ) return $args;

    $args['class'] = array('form-input-group');
    $args['required'] = false;

    return $args;
}

所以您将不得不管理 CSS 以进行设计更改。

此数组中的所有可用参数 $args 是：

'type'              # @ string
'label'             # @ string
'description'       # @ string
'placeholder'       # @ string
'maxlength'         # @ boolean
'required'          # @ boolean
'autocomplete'      # @ boolean
'id'                # => $key (argument)
'class'             # @ array
'label_class'       # @ array
'input_class'       # @ array
'return'            # @ boolean
'options'           # @ array
'custom_attributes' # @ array
'validate'          # @ array
'default'           # @ string
'autofocus'         # @ string
'priority'          # @ string

使用 woocommerce_form_field_{field_type} 过滤器挂钩，您可以根据字段类型单独访问字段设置。这个钩子有 4 个可用参数：$field、$key、$args 和 $value…

自定义 Woocommerce 模板 my-account/form-edit-addresses

Customizing Woocommerce template my-account/form-edit-addresses

php

forms

wordpress

woocommerce

hook-woocommerce