How to Upload Files & Images from Gravity Forms to Advanced Custom Fields (2024)

How to Upload Files & Images from Gravity Forms to Advanced Custom Fields (1)Jordan Smith

/Updated January 17, 2022 /43 Comments

How to Upload Files & Images from Gravity Forms to Advanced Custom Fields (2)

This article requires the Gravity Forms Media Library perk.

Buy Gravity Perks to get this perk plus 47 other premium Gravity Forms plugins!

View PluginBuy Gravity Perks

GP Media Library enhances Gravity Forms to allow automatically importing files and images to the WordPress Media Library when you submit the form.

In this tutorial, we will show you how to use GP Media Library to map a submitted file or image to an Advanced Custom Fields (ACF) custom field.

Looking to upload files to Advanced Custom Fields with the Gravity Forms Advanced Post Creation Add-On? We have an article that walks you through it.

Steps

  1. Add an Image or File custom field via ACF
  2. Add a GF Custom Field to your form
  3. Set GF Custom Field field type to “File Upload”
  4. Map ACF Field to GF Custom Field
  5. Activate GP Media Library for the GF Custom Field

1. Add an Image or File custom field via ACF

The first thing we will do is visit the ACF Field Groups page and add an Image or File custom field.

2. Add a GF Custom Field to your form

Next, we will visit our Gravity Form and add a Custom Field to our form from the Post Fields section.

3. Set GF Custom Field field type to “File Upload”

Now let’s open the Custom Field field, locate the Field Type setting, select “File Upload” from the drop down.

GF File Upload Pro

Enhance File Upload fields with image previews, cropping, and more using Gravity Forms File Upload Pro.

Get File Upload Pro

4. Map GF Custom Field to ACF Custom Field

Locate the Custom Field Name setting. If you’ve just created the ACF field (like we did in this tutorial), select “New” and enter the name of your ACF field.

If you’re using an existing ACF field, selected “Existing” and select the field name from the drop down that appears.

5. Activate GP Media Library for the GF Custom Field

Lastly, select the “Perks” tab at the top of the field and select the “Upload to Media Library” option.

All set! Now, when the form is submitted, the file/image uploaded in this field will automatically be imported into the Media Library and mapped to the ACF custom field.

Working with ACF Gallery fields?
Good news! This plugin also supports mapping Gravity Forms Multi-file Upload fields to ACF Gallery fields.

We hope this helps!

Did this help you out? Let us know in the comments below!

Did this resource help you do something awesome with Gravity Forms?

Then you'll absolutely love Gravity Perks; a suite of 47+ essential add-ons for Gravity Forms with support you can count on.

View All PerksBuy Now

Tags: Advanced Custom Fields, custom field, file upload field, GP Media Library

  1. How to Upload Files & Images from Gravity Forms to Advanced Custom Fields (8)

    HoomanJanuary 30, 2024 at 6:04 pm

    I’m trying to set this up for a client who’s purchased it. But I couldn’t find a way to integrated multiple file upload with ACF image or gallery properly. Is there any documentation beyond this?First, I was expecting this to work way better out of the box.I found some hacks, following the code from the developer who was previously working on the project, to use gform_pre_render and gform_field_value_field_id to load previews. (I’m setting GFFormsModel::$uploaded_files in gform_pre_render to set the file URLs).The preview images are the same (the first image getting repeated). Looking at the code data-file-id is set to the right image but the actual preview is the same (first) image getting repeated.

    Reply

    1. How to Upload Files & Images from Gravity Forms to Advanced Custom Fields (9)

      Samuel BassahStaffJanuary 31, 2024 at 4:16 am

      Hi Hooman,

      I have some follow-up questions to better understand the issue you’re having, so we’ll be assisting you via the support ticket you submitted.

      Best,

  2. How to Upload Files & Images from Gravity Forms to Advanced Custom Fields (10)

    ChrisSeptember 28, 2023 at 4:06 pm

    I have a custom post type with an ACF repeater field for “document uploads”. I am using a gravity form to allow front-end post submission of the specific post type.

    In the gravity form I have a file upload field and enabled multiple files and am using Advanced Post Creation. Everything maps correctly, except the file upload field.

    Are there any solutions for mapping docs, pdfs, etc. to an ACF Repeater Field using the file upload field in Gravity Forms?

    Reply

    1. How to Upload Files & Images from Gravity Forms to Advanced Custom Fields (11)

      Scott RyerStaffSeptember 29, 2023 at 4:14 pm

      Currently, we only have a solution for mapping a Multi-file Upload field to an ACF Gallery field. Repeater fields are not supported. If you’re a Gravity Perks Pro customer, drop us a line in support, and we can look into adding support for this via a snippet.

  3. How to Upload Files & Images from Gravity Forms to Advanced Custom Fields (12)

    SiavashSeptember 17, 2023 at 9:23 am

    HI,I followed your instructions to upload a photo into my ACF field in user’s profile, I have also added the following snippet to my website: https://github.com/gravitywiz/snippet-library/blob/master/gp-media-library/gpml-acf-user-image-field.phpBut still i can not get it to work. After submitting the form, I can see the image address in the input section of the form but it is NOT saved in the acf field. How can I fix this?

    Reply

    1. How to Upload Files & Images from Gravity Forms to Advanced Custom Fields (13)

      David SmithStaffSeptember 18, 2023 at 4:28 pm

      To confirm, did you also install and activate GP Media Library? This tutorial/snippet requires it to work correctly.

  4. How to Upload Files & Images from Gravity Forms to Advanced Custom Fields (14)

    Joost van der BurghtJune 23, 2023 at 8:48 am

    Does this work with custom fields assigned to a user profile? Can’t seem to get it to function.

    Reply

    1. How to Upload Files & Images from Gravity Forms to Advanced Custom Fields (15)

      Scott RyerStaffJune 23, 2023 at 11:42 am

      Hi Joost,

      Uploading images to the user profile requires an additional snippet. Do note that this snippet works in conjunction with the Gravity Forms User Registration add-on. You can only upload user image files when creating a new user or updating an existing profile.

  5. How to Upload Files & Images from Gravity Forms to Advanced Custom Fields (16)

    Simon VincentJuly 20, 2022 at 6:34 am

    Does this work with custom fields assigned to a user profile? Can’t seem to get it to function.

    Reply

    1. How to Upload Files & Images from Gravity Forms to Advanced Custom Fields (17)

      Samuel BassahStaffJuly 20, 2022 at 7:02 am

      Hi Simon,

      This won’t work with custom fields in User Post, because this is using the Post fields. I’ve sent you a message via email with more information on how to do this.

      Best,

  6. How to Upload Files & Images from Gravity Forms to Advanced Custom Fields (18)

    Bradley MaravalliDecember 3, 2021 at 2:55 pm

    Does this support WP multisite ?

    Reply

    1. How to Upload Files & Images from Gravity Forms to Advanced Custom Fields (19)

      Scott RyerStaffDecember 3, 2021 at 4:34 pm

      Hi Bradley,

      It does, yes. All of our Perks do. Since sent us a support request, we’re going to reply there so we can get the bottom of your issue.

  7. How to Upload Files & Images from Gravity Forms to Advanced Custom Fields (20)

    TheodoreMarch 27, 2020 at 8:31 am

    Hi, I think this is just what i need, but i cant get it to work.

    Im trying to use this perk to upload an image to a custom user profile field (created by ACF).

    1. Created the Custom field (tried types: file and image)
    2. Added the custom field in GF, selected file upload and mapped to the Custom field i created.
    3. Created a feed of user registration addon to create a new user (trying both: mapping the field there too or not).

    Am i doing something wrong?

    Any help would be great.

    Reply

    1. How to Upload Files & Images from Gravity Forms to Advanced Custom Fields (21)

      Ryan DonovanMarch 27, 2020 at 9:39 am

      Hello Theodore, do you currently have the Gravity Forms Media Library perk installed? If you need further help with this, could you drop us a line via the support form and we’ll be happy to help!

  8. How to Upload Files & Images from Gravity Forms to Advanced Custom Fields (22)

    Christopher CollettDecember 2, 2019 at 6:59 am

    When I enable the media library perk and pair it with my ACF field, the top of the form throws an error:

    Notice: Undefined index: id in /wp-content/plugins/gp-media-library/class-gp-media-library.php on line 512

    Reply

    1. How to Upload Files & Images from Gravity Forms to Advanced Custom Fields (23)

      David SmithStaffDecember 4, 2019 at 8:19 am

      Hi Christopher, if you haven’t already, drop us a line via support. We’ll be happy to dig into this.

    1. How to Upload Files & Images from Gravity Forms to Advanced Custom Fields (25)

      David SmithStaffAugust 25, 2019 at 11:24 am

      Is your ACF field a Gallery field or a single Image/File field?

    2. How to Upload Files & Images from Gravity Forms to Advanced Custom Fields (26)

      Christian SchneiderAugust 25, 2019 at 2:50 pm

      In ACF it’s a file field. Single. And in my Gravity form, it’s a File Upload, and in that File Upload it works perfekt with a single file, pdf, image, whatever.. But when I change it in Gravity to “Allow multiple files”, it only uploads one of the files to the post.

      Am I doing it wrong? Or obviously I am, but what lol ?

  9. How to Upload Files & Images from Gravity Forms to Advanced Custom Fields (27)

    AsafNovember 5, 2018 at 3:06 am

    Hi

    I’m using your tutorial, but for some reason, when I go to the user edit page, I can’t see the file attached to the custom field.For some reason it doesn’t save it, as other fields.BTW, I tried using custom field field type, and file upload field type.Both not saving the file, though it is saved to the media

    Reply

    1. How to Upload Files & Images from Gravity Forms to Advanced Custom Fields (28)

      NatalieOctober 12, 2021 at 6:48 am

      Appreciate this is a longshot but I’m having the same problem…Just wondered if you managed to resolve this?

    2. How to Upload Files & Images from Gravity Forms to Advanced Custom Fields (29)

      Samuel BassahStaffOctober 12, 2021 at 7:32 am

      Hi Natalie,

      You can try setting the ACF field return value to URL and ensure the GP Media Library Perk is activated on the field. If this doesn’t work for you, you can get in touch with us via our support form so we dig into this further.

      Best,

  10. How to Upload Files & Images from Gravity Forms to Advanced Custom Fields (30)

    Leland ZarembaAugust 4, 2018 at 12:21 pm

    Is it possible to show the uploaded thumbnails directly below the upload field instead of image file name? Is this something we could achieve with an HTML field and the merge tags or do they not work until after post submission? Would this be JS?

    Reply

    1. How to Upload Files & Images from Gravity Forms to Advanced Custom Fields (31)

      David SmithStaffAugust 24, 2018 at 10:12 am

      Hi Leland, we don’t have a solution for this one.

    2. How to Upload Files & Images from Gravity Forms to Advanced Custom Fields (32)

      LelandAugust 24, 2018 at 10:31 am

      I’ve sorted it out with some expert help from Codeable. Thanks for providing a great resource to the community.

  11. How to Upload Files & Images from Gravity Forms to Advanced Custom Fields (33)

    eanJuly 15, 2018 at 11:19 am

    I guess this doesn’t work with image files within repeater field or gallery? I would need to have multiple images on the form.

    Reply

  12. How to Upload Files & Images from Gravity Forms to Advanced Custom Fields (34)

    Kristopher HadlockApril 1, 2018 at 6:00 am

    First off, thanks for your hard work on the Perks set of plugins, nice job. We are attempting to connect an Custom Field to an ACF file field and we’re not seeing any ACF fields appear in the Custom Field Name drop-down. Could we be missing a perks plugin?

    Reply

    1. How to Upload Files & Images from Gravity Forms to Advanced Custom Fields (35)

      Kristopher HadlockApril 1, 2018 at 6:13 am

      We determined that the issue had to do with the fact that the field was never used in a Post. The issue is it had been used for a User, so that part seems like a bug with the Gravity Forms plugin itself. However, once we were able to get it connected we also found that the image was not added to the Users associated ACF field. Does this not work with ACF fields that are associated with Users?

    2. How to Upload Files & Images from Gravity Forms to Advanced Custom Fields (36)

      David SmithStaffApril 2, 2018 at 9:11 am

      Hey Kristopher, we’ll be happy to help via support. ?

  13. How to Upload Files & Images from Gravity Forms to Advanced Custom Fields (37)

    OlivierJanuary 15, 2018 at 12:48 am

    Hi David,

    I know you answer a similar question in a previous comment but I just want to be sure GP works for my case before I buy it.

    I’m using GF to create users and update their profiles. In my “Update your profile” form, I have a picture profile upload field (image) and I manage that field with ACF in the backend of WP (native WP users). In your tutorial, you said to create a Custom field in GF but because it’s a profile update form (and not a form to create a post), is it still a Custom field? Because with the User registration GF add-on, you have to map the fields in the settings and not with Custom field like we would do normally.

    I still think this should be included in the default User registration add-on. You can populate a user profile with custom user meta fields unless it’s a upload field…

    Thank you

    Reply

  14. How to Upload Files & Images from Gravity Forms to Advanced Custom Fields (38)

    Samuel YoungMay 27, 2017 at 10:27 am

    Would this work for uploading an avatar to a user profile?

    Reply

    1. How to Upload Files & Images from Gravity Forms to Advanced Custom Fields (39)

      David SmithStaffMay 28, 2017 at 11:16 am

      Hi Samuel, it would not replace the default WordPress avatar; however, you could feasibly use ACF to power local avatars and then this snippet would allow users to upload them via Gravity Forms. Here’s a start: http://thestizmedia.com/acf-pro-simple-local-avatars/

  15. How to Upload Files & Images from Gravity Forms to Advanced Custom Fields (40)

    Adam C.May 18, 2017 at 1:09 pm

    Hi I have run into an issue when using this method under HTTPS on WP Engine. I’m getting a

    Warning: filesize(): stat failed

    …Error message. Works fine under HTTP. Any thoughts on this?

    Reply

    1. How to Upload Files & Images from Gravity Forms to Advanced Custom Fields (41)

      David SmithStaffMay 19, 2017 at 7:44 am

      Are you using Gravity Forms Media Library? If so, we’ll be happy to help you via support.

  16. How to Upload Files & Images from Gravity Forms to Advanced Custom Fields (42)

    PieterApril 11, 2017 at 10:25 am

    Hi!First of all: I love the gravity perks. They really saved me loads of time.I am now trying to use this perk to upload an image to a custom user profile field. I can’t get this to work. I am using the gravityforms user update plugin as well.Hope you can point me in the right direction to get this working.Pieter

    Reply

    1. How to Upload Files & Images from Gravity Forms to Advanced Custom Fields (43)

      David SmithStaffApril 11, 2017 at 12:10 pm

      Hi Pieter, we’ll reply to your support request. This will probably need a little custom code to fill the gap.

  17. How to Upload Files & Images from Gravity Forms to Advanced Custom Fields (44)

    EduardoApril 4, 2017 at 7:31 am

    Hi,

    So is possible to show thumbnails in front-end with all images the user uploaded instead plain-text?

    It requires ACF or there’re another way to do this?

    Thanks in advance

    Reply

    1. How to Upload Files & Images from Gravity Forms to Advanced Custom Fields (45)

      David SmithStaffApril 4, 2017 at 12:00 pm

      Hi Eduardo, check out the “Image Merge Tags” section here: https://gravitywiz.com/documentation/gravity-forms-media-library/ If you need a way to support merge tags on posts, see: https://gravitywiz.com/documentation/gravity-forms-post-content-merge-tags/

  18. How to Upload Files & Images from Gravity Forms to Advanced Custom Fields (46)

    K AMarch 19, 2017 at 9:20 am

    Could we populate all the ACF fields via GF, any code snipped to do so?

    Reply

    1. How to Upload Files & Images from Gravity Forms to Advanced Custom Fields (48)

      David SmithStaffFebruary 7, 2017 at 9:05 pm

      Hi Ladislav, possibly. It would probably require a small amount of customization. Drop me a line (david at gravitywiz dot com) and let me know how you’re using Pods currently and how this would fit in with that.

  19. How to Upload Files & Images from Gravity Forms to Advanced Custom Fields (49)

    WilfridJanuary 29, 2017 at 10:01 pm

    Hi,Thanks for this perks ,But, when i use it with the gravityforms user update plugin i got this :

    Reply

    1. How to Upload Files & Images from Gravity Forms to Advanced Custom Fields (50)

      David SmithStaffFebruary 3, 2017 at 8:36 am

      Drop us a line via the support form and we’ll be happy to help!

Leave a Reply

How to Upload Files & Images from Gravity Forms to Advanced Custom Fields (2024)
Top Articles
Latest Posts
Article information

Author: Reed Wilderman

Last Updated:

Views: 5363

Rating: 4.1 / 5 (52 voted)

Reviews: 83% of readers found this page helpful

Author information

Name: Reed Wilderman

Birthday: 1992-06-14

Address: 998 Estell Village, Lake Oscarberg, SD 48713-6877

Phone: +21813267449721

Job: Technology Engineer

Hobby: Swimming, Do it yourself, Beekeeping, Lapidary, Cosplaying, Hiking, Graffiti

Introduction: My name is Reed Wilderman, I am a faithful, bright, lucky, adventurous, lively, rich, vast person who loves writing and wants to share my knowledge and understanding with you.