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

    Upload Button Text "Upload a file"

    Asked by headline on July 08, 2011 at 06:38 AM

    Hello,

    i just searched for ist, but the answers couldnt help me.

    First: sorry if my english is too bad.

     

    So, the text for the Upload button is hardcoded in the javascript?
    I searched the scripts but cant find this text....

    can you please help me. Im german and the text should be "Datei hochladen"...

     

    thanks

  • Profile Image
    JotForm Support

    Answered by abajan on July 09, 2011 at 03:36 AM

    Hi headline

    After closely searching the main JavaScript file linked to in your form's source (see Line 924 of http://cdn.jotfor.ms/jotform.jgz?3.1.110), I was able to deduce that the "Upload a file" text is located in the code at the following URL: https://www.jotform.com/file-uploader/fileuploader.js.

    Knowing this, I suggest doing the following:

    1. Create a directory on your site and name it file-uploader

    2. In that folder, create a file and name it fileuploader.js

    3. Copy all of the code found at https://www.jotform.com/file-uploader/fileuploader.js and paste it into fileuploader.js

    4. Go to Line 489 of that file and change "Upload a file" to whatever you wish (within reason: don't use so many characters that they would exceed the width of the button. Although it is possible that it is designed to expand to accommodate the text but I doubt it.)

    5. Create a directory on your site called js (assuming there isn't one already that contains scripts for other parts of your site)

    6. In that folder, create a file and name it multi-upload-form-button.js

    7. Copy all of the code found at http://cdn.jotfor.ms/jotform.jgz?3.1.110, paste it into multi-upload-form-button.js, change this part of Line 924 to the (preferably relative) URL of fileuploader.js wrapped in double-quotes. In other words, if your webpage that will have the form is setup like that pictured in the screenshot below, your relative URL to multi-upload-form-button.js would be ../file-uploader/fileuploader.js and you would replace all of this with this (exactly as it is with the double-quotes)


    8. Save the changes

    9. Copy the full source of the form in question, change the value of the src attribute highlighted in the screenshot below to the relative URL of multi-upload-form-button.js (js/multi-upload-form-button.js), paste it into your webpage and save the change


    I think that's about it. Now, anytime you wish to change the text on that form's multi-upload button, just change the text in fileuploader.js as described above. (To change the color of the button, please follow the instructions outlined by my colleague Neil in this thread.)

    Please let us know if you were able to successfully implement the solution provided above. If not, there may be another method we can come up with. Also, if you need help with anything else related to our product, please don't hesitate to ask for assistance on this forum.


    ~ Wayne

  • Profile Image

    Answered by headline on July 11, 2011 at 05:05 AM

    Thank you! It worked fine.

    I dont know why but it doesnt work with the path

    "../file-uploader/fileuploader.js"

    I paste the full path with http:// etc... I mean the full URL of the fileuploader.js.

  • Profile Image
    JotForm Support

    Answered by abajan on July 11, 2011 at 06:10 AM

    Glad I was able to help, headline. And thanks for letting me know that the absolute URL (as opposed to a relative URL) is required for this to work because I have never actually tested this!


    ~ Wayne

  • Profile Image

    Answered by jrnetwork on November 11, 2011 at 02:09 AM

    Why is this the only way to edit the text on the "Upload a file" button?. Shouldn't this be able to be edited in the form set up? 

    Also, as it's a multiple file upload button, why is the wording only singular, not plural?

  • Profile Image
    JotForm Support

    Answered by idarktech on November 11, 2011 at 02:24 AM

    Hi there,

    Sorry to say but that's the only way to edit it at the moment, but I will try to submit your idea to our higher level to see if they can create an easiest way for this, we'll just let you know once the feature is added. Also, I don't think there's a problem with the wording because multiple file upload button allows one or more files, so "Upload a file" is right? :)

    If you have further questions, please feel free to let us know.

  • Profile Image

    Answered by jrnetwork on November 11, 2011 at 02:29 AM

    Multiple means 1 or more files. But the button only says singular "file". It is a bit misleading for the end user. Would be much better if if said "Upload your file(s)".

    Also from a useability view point, the end users tend to think that when they click on the "upload" button, that it is indeed actually doing that, and therefore wonder why they need to click a second 'send' button.

    Other forms I've seen call their 'upload' button "Browse for file(s)" ... and then the second button the "Upload" button. That's the natural flow from a useability perspective.

  • Profile Image
    JotForm Support

    Answered by idarktech on November 11, 2011 at 02:40 AM

    Thank you for your explaination, it's greatly appreciated, as I've mention above that I have this raised to our developers to see if they could add another feature for renaming the File Upload Button wording. We will just let you know once it's finished but we cannot guarantee a specific time for completion since our developers have other priorities right now. Thank you for understanding and have a great day!

  • Profile Image

    Answered by emrew86 on November 14, 2011 at 08:15 AM

    Hi headline, Feature has been implemented. Anymore you can change the name of multiupload button.

  • Profile Image

    Answered by jrnetwork on November 14, 2011 at 09:12 AM

    This is fantastic news!

    Just tried it on an existing form, works perfectly.

  • Profile Image

    Answered by kynthia on March 07, 2012 at 10:46 PM

    On my forms, the Settings menu has the field that is shown above for editing the button text, and it is set by default to "Upload a File", but what is actually displayed is a plain grey rounded button that says "Browse..." and that text does not change, even if I edit it in the Settings menu.

    The example form that I was given as a template when I first signed up has the orange button shown above, and it's text is editable, but every other button that I have added since then is different.  I guess I could always build my forms from a template, but what if I want to add more than one upload button?  The difference in their format is striking, and confusing to the user.

    I'd really like to be able to change the button to match the orange one shown above, so please let me know if this is a common problem, or if I am encountering some kind of glitch.  I'm using Firefox, in case that matters.

    On a related note, the fact that using my own button image is an option for the Submit button but not the Upload button is kind of annoying; it keeps me from being able to have consistent button art within the form as a whole. 

    Any help would be appreciated!

    Thanks!  :)

  • Profile Image
    JotForm Support

    Answered by idarktech on March 07, 2012 at 11:18 PM

    @kynthia,

    First off, thank you for using JotForm.

    Changing upload button text is only applicable for Multiple Upload Tool. When you are using the default upload tool (Or single file upload tool), changing button text will not work on this.

    In order for your button text to work, please use multiple upload tool instead. To do that you can follow this steps below:

    1. Add File Upload tool to your form

    2. Click Allow Multiple menu on the toolbar.

    3. You can now then change your multiple upload button text.

    Hope that I've understand your question correctly. If there's anything that I have missed, please let me know. Thank you so much!

  • Profile Image

    Answered by pauldjoyce on February 19, 2015 at 11:21 PM

    Jotform support said:

    Changing upload button text is only applicable for Multiple Upload Tool. When you are using the default upload tool (Or single file upload tool), changing button text will not work on this.

    could a change be made so that the upload button can be renamed for single file uploads too?