What is JotForm?
JotForm is a free online form builder which helps you create online forms without writing a single line of code. No sign-up required.

At JotForm, we want to make sure that you’re getting the online form builder help that you need. Our friendly customer support team is available 24/7.

We believe that if one user has a question, there could be more users who may have the same question. This is why many of our support forum threads are public and available to be searched and viewed. If you’d like help immediately, feel free to search for a similar question, or submit your question or concern.


  • Profile Image

    How to style upload button on a 'single image preview' widget

    Asked by voeth on September 26, 2014 at 05:17 PM

    Is it possible to customize the button that is part of the 'single image preview' widget, either through selecting frmo a set of examples of differently styled buttons, or by adding html or css? I've tried the latter, but don't know what class or id this button part of the widget can be called by.

    Thanks in advance!

    Screenshot
    custom button style upload button single image preview image preview
  • Profile Image
    JotForm Support

    Answered by Mike_T on September 26, 2014 at 06:53 PM

    Thank you for contacting us.

    Most of the jotform widgets are being loaded from a remote address, so that we can not use CSS injections on them. In other words, we can not apply our custom CSS on the Single Image Preview widget. 

    In case you can use a standard Upload File field, it is possible to use the next CSS selector:

    input[type="file"] {
    //styles here
    }

    However, it might be still not that easy to style the upload button, since browser use their default upload button controls. There is an article about this:

    Styling an input type="file"

    Also, you can find some workarounds on a Stackoverflow:

    html - Styling an input type=“file” button

    Please feel free to contact us if you need any further assistance.