Can I create a form that includes a "upload image" button that shows the uploaded image in a specific field?

  • MobilityConsultant
    Asked on February 17, 2019 at 1:56 PM

    Hi,


    I want to create a professional form in a B2B context where the end user has to upload an image with a specific size. After the user uploaded the picture, it should be shown in a specific field with a specific size, among other contents.


    The idea is to send the form out to companies, so that they can enter their specifications for different campaigns. Before submitting, they should see how the campaign would look like in our app (including their images and texts for the campaign). 

    Is that possible? Thank you in advance. 



    Best,

    JW

  • Alan_D
    Replied on February 17, 2019 at 3:05 PM

    You can use our 'Image Upload Preview' widget for this purpose. Please look at this example.
    Adding widget into our form:
    1550433623drag drop Screenshot 10

    A little sample:
    1550433693preview Screenshot 21

    Please contact us for further support.

  • MobilityConsultant
    Replied on February 17, 2019 at 4:59 PM

    Thank you for your answer.

    Can I customize the preview area?

    I would like to add text columns and adapt the design to out app so that the end customer filling out the form can see how his input will dispay within our app

  • Alan_D
    Replied on February 17, 2019 at 5:54 PM

    Widgets are a little complicated and restricted fields. You can just change its CSS properties in 'Custom CSS' tab.
    1550443646widget Screenshot 10
    Preview area has 300px width initially. You can decrease this. Also, there is no limit for area's height. Following code changes preview image properties:

    div#image-main img{
    width:100px !important;
    height: 150px !important;
    }

    This code provides 100×150px preview size. It must be injected into 'Custom CSS' tab.

    For further support, please contact us.