How to insert an icon before or after the file upload button?

  • Profile Image
    basakabi
    Asked on August 25, 2017 at 12:52 PM

    Hi there,

    How could I insert an icon (something like a magnifying glass or similar) in the upload button just before or after the text inside?

    Thanks for your kind help.

    Best regards

    Diego

  • Profile Image
    ashwin_d
    Answered on August 25, 2017 at 02:16 PM

    Hello Diego,

    Please inject the following custom css code in your form to add an image before the file upload button:

    .inputContainer {

        background: url(https://www.jotform.com/uploads/ashwin_d/form_files/magnifying-glass.300.png) no-repeat scroll 5px 5px;

        background-size: 22px;

        background-position-x: 17px;

        background-position-y: 9px;

    }

    The following guide should help you how to inject custom css code in form: https://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes 

    Feel free to change the magnifying glass image URL with your own image URL. 

    Thank you!