如何保存个人资料图片并在编辑帐户页面woo-commerce中显示

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了如何保存个人资料图片并在编辑帐户页面woo-commerce中显示相关的知识,希望对你有一定的参考价值。

我想添加上载配置文件字段并将其保存在编辑帐户页面中,而在woocommerce中没有任何插件。

[我在functions.php中添加了以下代码以在帐户页面中添加个人资料照片

add_action( 'woocommerce_edit_account_form', 'add_profile_imageto_edit_account_form' ); function add_profile_imageto_edit_account_form() 
$user = wp_get_current_user();
?>
    <p class="woocommerce-form-row woocommerce-form-row--wide form-row form-row-wide">
        <label for="favorite_color"><?php _e( 'Upload Profile Photo', 'woocommerce' ); ?>  </label>
        <input type="file" name="profile_image" id="profile_image" placeholder="Upload Profile Photo" />
</p>
<?php 

建议任何人如何保存此数据并在编辑帐户页面中显示保存的数据。

答案

您有3个选项来显示新字段

  1. 作为使用woocommerce_edit_account_form_start钩子的第一个字段(在我的代码中使用)
  2. 在使用woocommerce_edit_account_form钩子的现有字段之后
  3. 在特定位置,覆盖myaccount/form-edit-account.php模板文件。

myaccount/form-edit-account.php

显示图像(可以在任何地方使用,在此示例中,在单个产品页面上使用]

// Add field
function action_woocommerce_edit_account_form_start() 
    ?>
    <p class="woocommerce-form-row woocommerce-form-row--wide form-row form-row-wide">
        <label for="image"><?php esc_html_e( 'Image', 'woocommerce' ); ?>&nbsp;<span class="required">*</span></label>
        <input type="file" class="woocommerce-Input" name="image" accept="image/x-png,image/gif,image/jpeg">
    </p>
    <?php

add_action( 'woocommerce_edit_account_form_start', 'action_woocommerce_edit_account_form_start' );

// Validate
function action_woocommerce_save_account_details_errors( $args )
    if ( isset($_POST['image']) && empty($_POST['image']) ) 
        $args->add( 'image_error', __( 'Please provide a valid image', 'woocommerce' ) );
    

add_action( 'woocommerce_save_account_details_errors','action_woocommerce_save_account_details_errors', 10, 1 );

// Save
function action_woocommerce_save_account_details( $user_id )   
    if ( isset( $_FILES['image'] ) ) 
        require_once( ABSPATH . 'wp-admin/includes/image.php' );
        require_once( ABSPATH . 'wp-admin/includes/file.php' );
        require_once( ABSPATH . 'wp-admin/includes/media.php' );

        $attachment_id = media_handle_upload( 'image', 0 );

        if ( is_wp_error( $attachment_id ) ) 
            update_user_meta( $user_id, 'image', $_FILES['image'] . ": " . $attachment_id->get_error_message() );
         else 
            update_user_meta( $user_id, 'image', $attachment_id );
        
   

add_action( 'woocommerce_save_account_details', 'action_woocommerce_save_account_details', 10, 1 );

// Add enctype to form to allow image upload
function action_woocommerce_edit_account_form_tag() 
    echo 'enctype="multipart/form-data"';
 
add_action( 'woocommerce_edit_account_form_tag', 'action_woocommerce_edit_account_form_tag' );

以上是关于如何保存个人资料图片并在编辑帐户页面woo-commerce中显示的主要内容,如果未能解决你的问题,请参考以下文章

如何使用户的个人资料页面可编辑,我想在编辑后保存这些数据(vue.js + laravel)

如何使用 NSURLSession 保存 Facebook 个人资料图片?

如何自动分配访问权限并允许员工登录和编辑他们的页面

如何在页面上显示来自 mongodb 数据库的用户数据,编辑数据并再次保存

从 iCloud 帐户访问用户个人资料图片

远程编辑共享本地资源后,不自动保存