Transferring Gravity Forms Uploads Into Media Library
GravityView lets you display all kinds of data collected with Gravity Forms. In this article, we will look at the different Gravity Forms image uploaders and the features they offer, including image upload resizing, image upload previewing, and prototype upload cropping.
Check out the video review below:
All-time Gravity Forms Image Upload Plugins
In 2020, Slim Image Cropper for Gravity Forms, a favorite Gravity Forms image uploader, was removed from the market by the developer. This led us on a search for the best Gravity Forms Image Upload Plugins. Luckily, 2022 has brought some new options to the tabular array.
Slim Image Cropper for Gravity Forms offered bully features like epitome upload resize, image upload preview, and image upload cropping. With this plugin at present off the market, there are a couple of other options to consider.
Let's take a look at them in more than item. The chief contenders to become your new favorite Gravity Forms prototype uploader are:
- Gravity Forms File Upload Pro
- Image Hopper
Nearly the Gravity Forms Epitome Uploader Plugin Options
| Plugin | Free/Paid |
| File Upload Pro | Bachelor as part of "Gravity Perks", starting from $59/twelvemonth |
| Prototype Hopper | Starting from $99/year for a single site license. |
Let's take a wait at each of these plugins in a piffling more item, shall we?
Gravity Forms File Upload Pro
This plugin is role of the Gravity Perks catalog from Gravity Wiz, a Gravity Forms Certified Developer. Information technology was originally released at the stop of 2020 and has had a number of enhancements since then. It makes utilise of the standard Gravity Forms File Upload field to add useful functionality to this field. File Upload Pro 1.1.5 was released in September 2021.
Gravity Forms File Upload Pro supports image upload resizing, image upload preview, and image upload cropping.
Image Hopper
This plugin was designed specifically every bit a replacement for Slim Image Cropper for Gravity Forms. Prototype Hopper was built by the creators of Gravity PDF, also a Gravity Forms Certified Programmer. This plugin has experienced exponential growth in its feature set this yr due to its integration with Pintura, the epitome editing engine backside Slim Image Cropper for Gravity Forms. Prototype Hopper 2.0 was released in September 2021.
Image Hopper supports image upload resizing, image upload preview, and prototype upload cropping likewise equally powerful epitome editing tools.
Let'south take a expect at how each Gravity Forms image upload choice performs the post-obit features:
Forepart Terminate Comparing
Here's what it looks similar when you lot're uploading files on the forepart:
GF File Upload Pro
File Upload Pro modifies the standard File Upload field from Gravity Forms.
Image Hopper
While Image Hopper adds its own separate field.
Installing GF File Upload Pro vs. Epitome Hopper
Allow'southward accept a await at how to install different Gravity Forms prototype upload plugins, starting with…
Installing GF File Upload Pro
To apply GF File Upload Pro, install the perk on your site past going to the Forms > Perks bill of fare in your admin bar.
From at that place, click on the Install Perks tab.
Next, detect the GP File Upload Pro perk and click Install Perk.
Now when you add a File Upload field to your course you'll see an additional tab called Perks, which includes a checkbox to "Enable File Upload Pro." (The options available to you on the Perks tab will depend on which Perks y'all have installed.)
Installing Prototype Hopper
Install Image Hopper as you would whatsoever new plugin: download information technology from your account after buy then upload it to your WordPress Plugins folio.
Once it is installed, you volition see a new option in the Avant-garde Fields of your form builder called Image Hopper.
Comparing Paradigm Upload Resize Functionality
Now that yous know how to install both plugins, permit's compare the functionality and capabilities of each.
Resizing Images Using GF File Upload Pro
To utilise GF File Upload Pro, you lot simply add together a standard File Upload field to your course, then check the box in the Perks tab labeled "Enable File Upload Pro."
Once you've checked the box to enable File Upload Pro, yous will see additional options to Enable Sorting and Enable Cropping. If you check Enable Cropping, you will run into additional options for image resizing.
As you'll see in the epitome below, you accept options to set Exact Dimensions past specifying the width and acme in pixels. You can specify max and min dimensions in the same mode. If Exact Dimensions or Max Dimensions are specified, the epitome(s) will be automatically downscaled to see the specifications.
You can as well set an aspect ratio (e.one thousand. 1:1 for a square paradigm). These will be automatically cropped (if applicable) unless you choose otherwise. See the section below most image cropping for more data.
File Upload Pro can besides be used in conjunction with GF Media Library to create multiple sizes of images based on your WordPress settings. By default, the Media Library creates a few dissimilar sizes of each image uploaded. To see what sizes your site uses, hover over Settings and click Media in your WordPress Admin Menu.
There y'all volition run into the diverse dimensions your site uses for your image upload resize.
Yous can alter these sizes to meet your needs and add additional sizes with a niggling bit of code or a plugin.
When you are set up to display these on your site, you'll be able to phone call on whichever of these preset sizes meets your needs (see How to Display an Uploaded Prototype in Gravity Forms below for more than information).
Resizing Images Using Image Hopper
To use Epitome Hopper, add the Image Hopper field to your form from the Advanced Fields section. There you will see an option to Downscale Images. Below that y'all will see a checkbox labeled "Crop to dimensions."
With the checkbox unchecked, the downscaling volition not crop your images to your exact dimensions. Instead, it will maintain the ratio of your paradigm, making sure that it does non exceed the dimensions you set in the Downscale Images field.
However, if y'all check "Crop to dimensions" the uploaded images will be cropped to the exact size you specified. With the basic license (without the Advanced Image Editor), the images will be automatically cropped for y'all, using the center of the image as the focal point.
With a license that includes the Advanced Image Editor (Single Site, 5 Site, or Ultimate), you will have the selection to allow your users to determine where to crop the paradigm. (Run across below for more than on the image cropper.)
All of the images uploaded using this field volition conform to the same size limits. However, you can add multiple Image Hopper fields to your class with different resize dimensions if you need different sizes.
The images uploaded using this field are not automatically saved to the Media Library just are accessible to display on your site using GravityView. Image Hopper does integrate with Gravity Perks' Media Library, so you lot can use both plugins to save your image to the Media Library, just as you would exercise with Gravity Perks' File Upload Pro.
Too, Epitome Hopper offers a Postal service Image field (in the Post Fields section), which does save images to the Media Library. The IH Post Image field differs in that it allows simply one image to be uploaded per field.
Gravity Forms Image Upload Preview Functionality
When uploading new images, it's always important to preview them get-go.
Previewing Images Using File Upload Pro
File Upload Pro offers two options for image preview functionality. Past default, the image upload preview is a thumbnail-sized image.
When hovered over, a pencil icon appears over the paradigm to indicate that information technology can exist edited.
Clicking on the pencil brings up a total-screen preview of the image.
This full-screen preview can also exist shown automatically by checking the Require Crop option in the File Upload Pro field settings.
Previewing Images Using Image Hopper
Prototype Hopper offers a clean-looking image upload preview. Information technology includes a drag and drop interface. In one case the image is dropped or selected, the preview shows a percent as the file is uploaded. When the upload is consummate, the meridian correct corner tells you and then. The x in the top right corner of the box provides a user-friendly manner to remove the image if your user changes their mind earlier submitting.
Gravity Forms Image Cropper Functionality
Image Cropping in File Upload Pro
File Upload Pro presents the option to enable image cropping. With cropping enabled, users will e'er have the pick to crop the image by clicking on the pencil icon that appears when they hover over the image preview. You tin can also force them to crop the image past checking the box side by side to Require Crop.
This is what the cropper looks similar with a i:one ratio set.
Prototype Cropping in Prototype Hopper
With any license that includes the Advanced Image Editor (Single Site, v Site, or Ultimate), you volition take the pick to allow users to crop their images. You tin can set the epitome editor to automatically open on upload, or users can choose to edit the image past clicking on the pencil icon that appears at the bottom of their image.
The Advanced Epitome Editor as well includes a number of other settings and gives you the option to choose which to include and which to exclude from the menu of options available to your users.
How to Display an Uploaded Image in Gravity Forms
The best way to brandish your images on the front terminate is past using GravityView. The GravityView plugin enables you to create "Views" that let you to brandish your form entries on the forepart end of your website.
Each of these plugins works a trivial differently to display an uploaded paradigm in Gravity Forms using GravityView.
Displaying File Upload Pro or Image Hopper Images on the Forepart Stop
File Upload Pro
Using File Upload Pro to display an uploaded paradigm in Gravity Forms, you'll but choose the File Upload field from your form when creating your View.
Once added, you tin can click the gear icon and adapt the settings as needed.
Image Hopper
Displaying images in GravityView with Image Hopper works much the same equally displaying images uploaded with File Upload Pro. Only select the Image Hopper field when creating your View.
Once added, you can click the gear icon and adjust the settings as needed.
Displaying Images Uploaded Using GF Media Library
To take reward of the resized images with GF Media Library, you'll add together a Custom Content field to your View. Utilize the merge tag selector to choose the merge tag for your epitome upload field.
Once the merge tag is inserted in your field, y'all can add the merge tag modifier of the size you would like to display. Hither are a few options using the merge tag {Image:4} – replace this with your merge tag:
-
{Image:four:thumbnail} -
{Image:4:medium} -
{Image:4:large}
You tin can identify what sizes these terms equate to by going to Settings so Media in the Admin Menu as described higher up.
This is what information technology volition expect like in your Edit View screen:
Gravity Forms Image Upload Plugins: Summing Upward
💡 Pro tip: To learn more virtually Gravity Forms, read How to Utilise Gravity Forms: The Ultimate Guide
Depending on your needs, there are a couple of good alternatives to Slim Image Cropper bachelor for Gravity Forms.
Gravity Forms File Upload Pro attaches to the standard file upload field in Gravity Forms. On its ain, it offers options to resize and crop multiple images likewise as to preview them as they are uploaded.
Connected to Gravity Forms Media Library, information technology makes use of the resizing characteristic of the WordPress Media Library. Each paradigm submitted volition be available in multiple sizes, which tin can be tweaked in your WordPress Settings to see your needs.
Paradigm Hopper was designed equally a replacement for Slim Paradigm Cropper. In the basic license, you lot'll find epitome preview and epitome resizing features too as basic prototype cropping features. With the Advanced Image Editor, a robust toolset of epitome editing features is available.
This plugin can also integrate with the Gravity Forms Media Library, allowing y'all to resize images to multiple sizes as described above.
And finally, if you lot want to display your images on the front end, you lot tin can use GravityView – our flagship addition for Gravity Forms that lets you display grade entries on your website in a diverseness of layouts.
Image Credit: Purple Flowers Photo by Kseniia Ilinykh on Unsplash
Join Our Newsletter!📧🙌
✅ Helpful Gravity Forms content straight to your inbox
✅ Be the first to hear nearly new updates and releases
Source: https://gravityview.co/gravity-forms-image-upload-plugins/
0 Response to "Transferring Gravity Forms Uploads Into Media Library"
Post a Comment