How can i change image on the upload a file button to one of my own images?

  • Profile Image
    PetresWeb
    Asked on November 22, 2013 at 07:14 AM
  • Profile Image
    EliezerN
    Answered on November 22, 2013 at 10:07 AM

    Thanks for contacting us.

    If you need to use your own image and to remove the current color and text from the buttom, let me inform you that it is possible by inserting this CSS code, please insert the next CSS code to your form:

    #id_25 .qq-upload-button

    {

    background-image:url('ENTER HERE THE URL OF YOUR IMAGE') !important;

    background-repeat:no-repeat !important;

    color: transparent !important;

    text-shadow: none !important;

    border:none !important;

    } 

    Make sure to enter the URL of your image where I've indicated you in the code. Sometime it is necesary to adjust the size of the bacground image, please see the next example:  

    I needed to udjust the size of the background so thatit can be displayed correctly, so I used the next code: 

    #id_25 .qq-upload-button

    {

    background-image:url('https://cms.jotform.com/uploads/image_upload/image_upload/global/21355_upload.png') !important;

    background-size: 200px 38px !important;

    background-repeat:no-repeat !important;

    color: transparent !important;

    text-shadow: none !important;

    border:none !important;

    }

    You can see the code that udjst the size of the background in bold. I cloned your form and made the changes, here it is so that you can see it and even clone if it's helpful for you: http://form.jotformpro.com/form/33253819803961 Use this guide to know how to clone it: How to clone an existing form from a URL

    I hope this helps. Please let us know if you need further assistance. Kindly open a new thread to post unrelated issues.

    Thanks