Croppie logo

Croppie

Published February 2017
   •    Updated today

Plugin details

Control for the user to crop and resize images before upload to Bubble.
Using the open source javascript library Croppie.

https://foliotek.github.io/Croppie/

Free

For everyone

3.8 stars   •   16 ratings
26.7K installs
This plugin does not collect or track your personal data.

Other actions

Contributor details

Misha V logo
Misha V
Joined 2016   •   4 Plugins
View contributor profile

Instructions

1. Add the Croppie element to your page.
2. Add button to Browse local images, workflow action:
- Browse a Croppie.

3. Add buttons to Rotate image, workflow action:
- Rotate a Croppie, choose rotation.

4. Add button to Save cropped image, workflow actions:
- Create a database record to attach image to (if making file private).
- Save a Croppie, this will initiate an image upload to storage (S3).

5. Add workflow event for Croppie is saved, workflow action:
- Make changes to a database record, set Image = This Croppie's image.

6. Set the properties on the Croppie element.

Types

This plugin can be found under the following types:
Element   •   Event   •   Action

Categories

This plugin can be found under the following categories:
Visual Elements   •   Input Forms   •   Media

Resources

Support contact
Documentation
Tutorial

Rating and reviews

Average rating (3.8)
Does the job
March 13th, 2025
would love if it had a feature to rotate by less than 90 degrees
Image quality
June 5th, 2024
How can i get a clearer image quality after the croppie has been saved? It works great aside the pixilated image saved
support is slow to respond if at all
January 18th, 2024
support is slow to respond if at all
Its a great start
December 13th, 2023
It works great for the most part, but it takes hours of testing. One thing that I didn't figure out yet, is how to NOT keep the original file in the File Manager.
Question- Can't use croppie rotate properly!
October 30th, 2023
I cannot find a way to use the workflow properly! I have read all documentation! All I'm trying to do is send the croppie to another workflow after rotate. Croppie is rotated via workflow. "When a Croppie loaded" > "rotate croppie". Is it not available as a dynamic expression after that, such as "Croppie A's result image"?
Bubble
AI + visual development: Our vision for a powerful partnership.
Watch now →