Uploadcare photo editing

I am using the uploadCare widget. My code is based on this example “https://examplesdev.fmbetterforms.com/#/form/FR_55E61E7A-9853-6D4A-8B30-29C9B5EBE947
The example does not implement the photo editing features available with the widget. I’m trying to get these editing features working. I’ve added the following to my apps DOM Header to enable the uploadcare “tab-effects”:
"<script src=" https://ucarecdn.com/libs/widget-tab-effects/1.x/uploadcare.tab-effects.lang.en.min.js "></script>"
With the current implementation of the widget in the BF example the widget disappears as soon as the photo is taken and the user is not given the opportunity to make edits. How can I get editing enabled?

Did some testing, it looks like you can enable editing by registering the tab using uploadcare.registerTab('preview', uploadcareTabEffects) and then adding the setting previewStep: true to your dialog settings. It would look something close to this:

I tested this by modifying the example you linked. You can take a look at that for your solution.

1 Like

Thank you. This worked perfectly.

If you are using Tailwind you may also want to add this to your CSS:
.uploadcare–button_primary {
background: #157cfc;
border-color: #157cfc;
color: #000000;
}