Gravity forms is like magic, you can create a form with advanced options without any real knowledge of coding. The basic plugin does not offer a way to show image previews for uploaded images, but with a little extra code it is easily implemntated.

The code is just copy paste while changing 2 numbers. Everybody can do it, you can do it.

First you need an image upload field:

• We set the extensions to only allow the image type we set
• Then we set the maximum upload size to 5MB

After the upload field we place the preview field: a HTML block. Add it to your form. We need two numbers:

To make the script ( follows later) work you need two values / variables:

• the form id.
• the field id (from the upload field)

Now we can fill the content of our HTML block with the code we need:
(copy paste it, and adjust the two values)

<div id="imgview"><img src="dummy.jpg" ></div>
<script>
 
    jQuery('#imgview').hide();
 
    function readURL(input) {
 
        if (input.files && input.files[0]) {
            var reader = new FileReader();
            jQuery('#imgview').show();
            reader.onload = function (e) {

                jQuery('#imgview>img').attr('src', e.target.result);
            }
 
            reader.readAsDataURL(input.files[0]);
        }
    }
 
    // change this "#input_1_12"
    jQuery(document).on("change", "#input_1_12", function () {
        readURL(this);
    });
</script>

The line below ‘change this’ you change the 1 to be your form id and the 12 to be you field id and that’s it

Save the form and testrun you script!