我想使用高级自定义字段从前端上传图像

Posted

技术标签:

【中文标题】我想使用高级自定义字段从前端上传图像【英文标题】:I want to Upload Image from front-end with Advanced custom field 【发布时间】:2021-06-02 21:58:48 【问题描述】:

我有很多高级自定义字段。它们之间存在三种图像类型。我用 add_post_meta 添加了 ACF 文本字段。但我无法添加图像。 这是我的代码示例

if( 'POST' == $_SERVER['REQUEST_METHOD'] && !empty( $_POST['new_post'] )) 
 
 $title="New Property for Sale";
    
  $custom_tags = $_POST['tax_input']; //load thread tags (custom tax) into array  
  $post = array( 
    'post_title'=>$title,
      'post_content'    => $_POST['property_description'],
      'tax_input'   => $custom_tags,
      'post_status' => 'pending',
      'post_type'   => 'property'
    );

    $post_id = wp_insert_post($post);
    
    //send our post, save the resulting ID
if($post_id)
add_post_meta($post_id, 'type', $_POST['acf']['field_60338ebdd3ca4'], true);
add_post_meta($post_id, 'locality', $_POST['acf']['field_603374e8f8d62'],true);
add_post_meta($post_id, 'address', $_POST['acf']['field_6034ed6a0cd29'], true);
add_post_meta($post_id, 'facing', $_POST['acf']['field_6034eda30cd2b'],true);
add_post_meta($post_id, 'bed_number', $_POST['acf']['field_60337452f8d5f'], true);
add_post_meta($post_id, 'balconies', $_POST['acf']['field_6034f2180cd2c'], true);
   //send the user along to their newly created post
  

我已添加帖子的特色图片。

  if ( $_FILES['image']['name']!="" )  
$upload = wp_upload_bits($_FILES["image"]["name"], null, file_get_contents($_FILES["image"]["tmp_name"])); 
   // $post_id = $post_id; //set post id to which you need to set featured image
    $filename = $upload['file'];
    $wp_filetype = wp_check_filetype($filename, null);
    $attachment = array(
        'post_mime_type' => $wp_filetype['type'],
        'post_title' => sanitize_file_name($filename),
        'post_content' => '',
        'post_status' => 'inherit'
    );
    $attachment_id = wp_insert_attachment( $attachment, $filename, $post_id ); 
    if ( ! is_wp_error( $attachment_id ) ) 
        require_once(ABSPATH . 'wp-admin/includes/image.php'); 
        $attachment_data = wp_generate_attachment_metadata( $attachment_id, $filename );
        wp_update_attachment_metadata( $attachment_id, $attachment_data );
        set_post_thumbnail( $post_id, $attachment_id );
    

我必须使用 ACF 添加更多两个图像。请帮帮我。

【问题讨论】:

图像本身不会添加到 postmeta 中,除非您将其转换为字符串(不推荐)。您可以将从前端上传的图像存储在主题/插件的特定文件夹中,仅将带有图像扩展名的名称存储在 postmeta 中,然后使用动态 url 在任何需要的地方显示图像。 我已经添加了帖子的特色图片。 wordpress.stackexchange.com/questions/282586/… 【参考方案1】:

这是 WP codex 上最直接的完整代码上传到媒体:

https://developer.wordpress.org/reference/functions/media_handle_upload/

因此,请尝试在 wordpress 页面模板中创建此文件,附加后您必须在 ACF 元数据上设置 ID

<?php 
if ( 
isset( $_POST['my_image_upload_nonce'], $_POST['post_id'] ) 
&& wp_verify_nonce( $_POST['my_image_upload_nonce'], 'my_image_upload' )
&& current_user_can( 'edit_post', $_POST['post_id'] )
) 
// The nonce was valid and the user has the capabilities, it is safe to continue.

  // These files need to be included as dependencies when on the front end.
  require_once( ABSPATH . 'wp-admin/includes/image.php' );
  require_once( ABSPATH . 'wp-admin/includes/file.php' );
  require_once( ABSPATH . 'wp-admin/includes/media.php' );
 
  // Let WordPress handle the upload.
  // Remember, 'my_image_upload' is the name of our file input in our form above.
  $attachment_id = media_handle_upload( 'my_image_upload', $_POST['post_id'] );
 
  if ( is_wp_error( $attachment_id ) ) 
    // There was an error uploading the image.
    echo "ERROR";
   else 
    // The image was uploaded successfully!
    echo "Image ID is: " . $attachment_id;
    //Now set your image ACF field to the $attachment_id 
    // My case because its a user metadata update: 
    //update_user_meta( $userID, 'YOUR_IMAGE_NAME_ACF_FIELD_HERE!!', $attachment_id );
    // update post meta of your ACF field with the new attachment id
    update_post_meta ( $_POST['post_id'], 'YOUR_IMAGE_NAME_ACF_FIELD_HERE!!' , $attachment_id );
  
 else 
// The security check failed, maybe show the user an error.


?>

<!-- html code for uploading this single file -->

<form id="featured_upload" method="post" action="#" enctype="multipart/form-data">
<input type="file" name="my_image_upload" id="my_image_upload"  multiple="false" />
<input type="hidden" name="post_id" id="post_id" value="55" />
<?php wp_nonce_field( 'my_image_upload', 'my_image_upload_nonce' ); ?>
<input id="submit_my_image_upload" name="submit_my_image_upload" type="submit" value="Upload" />
</form>

【讨论】:

以上是关于我想使用高级自定义字段从前端上传图像的主要内容,如果未能解决你的问题,请参考以下文章

高级自定义字段获取子字段图像

如何从 WordPress 数据库中获取高级自定义字段字段键?

高级自定义字段 wordpress 图像大小

GatsbyJS:从 WPGraphQL 查询 Gatsby-image 以获取高级自定义字段

将高级自定义字段添加到 WooCommerce 产品变体

高级自定义字段在管理屏幕上很慢