Image Cropping UI

The Image Cropping UI gives you more control over uploaded files while also providing a clean user experience.

watch the Image Cropping UI tutorial

Let your users crop images they upload with the Image Cropping UI

The Image Cropping UI is a Form Extension designed to make both your and your user’s file upload experiences better by providing a sleek UI with greater control both in the Elementor editor and in the front end form that the user will fill out.

You can find and use this function by creating a simple File Upload form field, and toggling on Enable Image Cropping.

This toggle will give the user the ability to crop the image after they’ve uploaded it.

Enable Image Cropping.

Once toggled on in the File Upload field settings, Enable Image Cropping will let your users do just what it says in the name.

The tool sports extreme customization as is usual with Gloo features, allowing you to change the container’s size, style, typography for the button, background, text and border colors. Within the container, the viewport showing a preview for the image can also be customized in width and height, as with its boundaries.

With that set up, every image uploaded using the File Upload field will present the user with a quick and easy tool to crop the image as they please, if needed. They can either save the changes they’ve made, or just not crop the image at all.

 

Frequently Asked Questions

The Image Cropping UI is a Gloo Form Extension for Elementor that allows users to crop images they upload to the website. It provides a sleek and customizable interface both in the Elementor editor and in the front-end form.
To enable the Image Cropping UI in Elementor, you need to create a simple File Upload form field and toggle on the “Enable Image Cropping” option in the field settings. This will give your users the ability to crop the image after they’ve uploaded it.
Yes, the Image Cropping UI is highly customizable. You can change the container’s size, style, typography for the button, background, text and border colors, and customize the viewport showing a preview for the image in width and height, as well as its boundaries.
THIS FEATURE IS PART OF :
Gloo logo - white

Image Cropping UI

Forms + Extension - header

Allow for cropping of images, directly by your users on the frontend.

Add a new form - choose file upload form field - toggle on enable image cropping
Image Cropping toggle
Works best with the image upload ui enabled
Image Upload UI toggle
To get the UI on your File Upload field looking like ours here on the left, toggle on Image Upload UI in the field options.
CUSTOMIZE VIEWPORT AND OTHER OPTIONS TO YOUR LIKING
This feature comes included with extreme customization capabilities. Remember to set up the UI to your liking using the options that appear once you toggle the feature on in the field options.

More Modules

PDF Generator New
Ajax Connector
Dynamic Nav Menu
Google Spreadsheet Tag
JetSmartFilters: BuddyBoss Addon New
Custom Post Type Form Field New
Repeater Dynamic Tag
3D Model Widget
Select2 Fields
Custom DB Value Dynamic Tag New
Buddyboss Groups Dynamic Tags New
Multicurrency Dynamic Tag New
GTM DataLayer Connector New
Image Upload UI New
WooCommerce Advanced Dynamic Tags New
GSAP Slider Tween New
OTP Form Action New
GSAP Line Drawing
Datepicker Field
Keyframe Animator New