WooCommerce 个人资料照片上传

WooCommerce是一款流行的WordPress插件，用于创建和管理电子商务网站。该插件内置了一个个人资料页面，可以让用户更新其个人信息。

然而，在默认情况下，WooCommerce个人资料页面不提供上传照片的功能。因此，我们需要自己编写代码来实现照片上传。

实现步骤

1. 创建一个照片上传字段

我们可以使用WordPress的内置函数get_avatar来实现照片上传。首先，我们需要创建一个新的meta字段来存储用户上传的照片。我们可以使用WooCommerce提供的woocommerce_edit_account_form钩子来添加该字段。

function add_custom_avatar_field() {
    echo '<p class="form-row form-row-first">
            <label for="custom_avatar">' . __('Custom Avatar', 'custom_avatar') . '</label>
            <input type="file" name="custom_avatar" id="custom_avatar" accept="image/*">
        </p>';
}
add_action( 'woocommerce_edit_account_form', 'add_custom_avatar_field' );

注意，我们需要将元字段设置为“图像”类型，以便只允许用户上传图像文件。

2. 处理并保存上传的照片

接下来，我们需要编写代码来处理用户上传的照片。我们可以使用woocommerce_save_account_details钩子来处理数据并将其保存到用户meta中。

function save_custom_avatar_field( $user_id ) {
    if ( ! empty( $_FILES['custom_avatar']['name'] ) ) {
        $upload = wp_upload_bits( $_FILES['custom_avatar']['name'], null, file_get_contents( $_FILES['custom_avatar']['tmp_name'] ) );
        if ( ! empty( $upload['error'] ) ) {
            wp_die( $upload['error'] );
        }
        update_user_meta( $user_id, 'custom_avatar', $upload );
    } else {
        delete_user_meta( $user_id, 'custom_avatar' );
    }
}
add_action( 'woocommerce_save_account_details', 'save_custom_avatar_field' );

我们使用wp_upload_bits()函数来将用户上传的文件保存到WordPress媒体库中。如果出现任何错误，我们将显示一个错误消息。最后，我们将文件路径保存到用户meta中。

3. 显示用户照片

最后，我们需要显示用户上传的照片。我们可以重写get_avatar()函数，并在其中检查用户是否有自定义头像。如果有，我们将显示上传的图片，否则显示默认头像。

function custom_get_avatar( $avatar, $id_or_email, $size, $default, $alt ) {
    $user = false;
    if ( is_numeric( $id_or_email ) ) {
        $id = (int) $id_or_email;
        $user = get_user_by( 'id', $id );
    } elseif ( is_object( $id_or_email ) ) {
        if ( ! empty( $id_or_email->user_id ) ) {
            $id = (int) $id_or_email->user_id;
            $user = get_user_by( 'id', $id );
        }
    } else {
        $user = get_user_by( 'email', $id_or_email );
    }
    if ( $user && is_object( $user ) ) {
        $custom_avatar = get_user_meta( $user->ID, 'custom_avatar', true );
        if ( ! empty( $custom_avatar['url'] ) ) {
            $avatar = '<img alt="' . esc_attr( $alt ) . '" src="' . esc_url( $custom_avatar['url'] ) . '" class="avatar avatar-' . esc_attr( $size ) . ' photo" height="' . esc_attr( $size ) . '" width="' . esc_attr( $size ) . '" />';
        }
    }
    return $avatar;
}
add_filter( 'get_avatar', 'custom_get_avatar', 10, 5 );

这里我们首先检查是否有自定义头像，如果有，则将用户上传的图片显示在首页中，否则还是显示WordPress默认的头像。

总结

通过以上步骤，我们成功实现了WooCommerce个人资料页面的照片上传功能。我们从创建自定义字段开始，然后处理和保存用户上传的数据，最后显示结果。