Integration with forms

Hi Luke,

For any custom forms, no matter what form builder is used, there is one uniform recipe how to bind Uploadcare widget to it easily:

• Add a normal field to your form to handle image URL. It’s preferred if you can add a field with type="hidden", but not necessary
• Include Uploadcare library and public key (see widget config snippets)
• Add a code snippet that would convert the field to Uploadcare widget, and add some settings to it (see JavaScript API and Widget configuration for more info):

<script>
    uploadcare.jQuery(function() {
        var field = uploadcare.jQuery('#your-field-id')
        field.data('images-only', true);
        field.data('preview-step', true);
        uploadcare.Widget(field);
    });
</script>

• If the field is not hidden, you may need to make it hidden, so add one more line to the code above: uploadcare.jQuery('#your-field-id').attr('type', 'hidden');

Thanks for the speedy response :). Is the above snippet to be used instead of the shortcode provided by the plugin? Can the above parameters be added to the shortcode?

You can definitely exlude shortcode.js from your page, as it is not needed in this case.

Also you should remove <input class="uploadcare-uploader"... > from your page, and add the code snippet I’ve provided.

Thanks but I am talking about a wordpress shortcode, I am not manually adding any javascript files, the shortcode is presumably triggering their inclusion via the plugin (same goes for the <input … markup.

Luke, we’ll add attributes to shortcut to make it more flexible. But the quickest way for you is to add widget code and treat your WP form just like an ordinary HTML form.