Image Upload Preview: Option to Accept PDF

Great widget, works well, but what file types will it accept?

Some pngs went through OK, but pdfs not allowed. A lot of my clients use pdfs for graphic design delivery. Can this be changed?

Hi DubStudio,

Thanks for reaching out to Jotform Support. If you would like to allow users to upload PDFs, I would suggest using the File Upload field instead. Let me show you how to add it to your form:

1. Open your form in Form Builder and click on Add Element on the upper-left side of the screen.
2. Under the Basic tab, scroll down to the Field Upload element and click on it to add it to your form.

You can specify which File Types your responders can upload. To do that:

1. Click on the File Upload field, and then click on the Gear icon to open File Upload Properties.
2. In the menu on the right side of the page click on the Options tab.
3. In the File Types section, remove unwanted file types and add the ones you want respondents to upload.

You can also check out our How to Create File Upload Forms guide for more information.

Give it a try and let us know if you have any other questions.

Thanks, but does the file uploader show you a preview image before submitting? No good if not.

I think it's a simple request: at the very least, show users which file types are allowed, so they don't have to use trial and error to find out. At most, allow user to define it for themselves within available parameters of course.

Hi DubStudio,

The File Upload field also shows a preview when an image is uploaded, though it’s smaller than the Image Upload Preview widget. For PDF files, there won’t be any preview since this feature only supports images. Check out the screenshot below for an example:

Right now, there isn’t an option in the Image Upload Preview widget to add a sublabel. But you can still show users which file types are allowed by Injecting CSS Codes into widget. Let me walk you through it:

1. First, copy this code:

#uploadForm > div.form-div.left.button-container > div > div > p {

  font-size: 0;

}

.selection-area p::after {

  content: "(Only .jpg, .jpeg, .png, .bmp, .gif are accepted)";

  font-size: 12px;

  color: #666;

}

2. In Form Builder, select the Image Upload Preview widget, then click on the Wand icon to open Widget settings.

3. Now, click on the Custom CSS tab and paste the code into the CSS Code box, then click on Update.

Give it a try and let us know how it goes.

1) Regarding the File Upload, what file uploader is this? It looks completely different to the one that I am using (Add Element>Basic>File Upload). I don't see a big window with drag and drop option, just one button that says "Browse Files".

2) Regarding Image Upload Preview, you are still not answering my OP. What files are permitted? I can't find a list anywhere. Where did you get this from:

jpg, .jpeg, .png, .bmp, .gif

?

Hi DubStudio,

The File Upload field accepts a wide range of file types, including PDF, Word, Excel, text, ZIP, audio, video, and common image formats such as JPG, JPEG, PNG, and GIF. If you want to allow only specific file types, you can set that in the field settings by entering the extensions you want to accept.

The Image Upload Preview widget is different. It is designed for images only, and it shows a preview right after the image is selected. It does not support PDF previews.

If you want users to upload PDFs, the best option is to use the File Upload field and set the allowed file types to PDF if needed. If you want users to see which file types are allowed, that can be shown by adding a short note near the field or by customizing the field display.

Reach out again if there’s anything else we can help you with.

OK, but I would like a full list of the file extensions permitted by Image Upload Preview.

For example, does it accept .tiff, or .bmp?

Hi DubStudio,

Currently, the Image Upload Preview widget typically supports standard web-friendly image file extensions, specifically JPG, JPEG, PNG, and GIF. While designed primarily for images, the widget is meant to show an immediate preview of images uploaded to your form, and it works on both desktop and mobile devices.

If your clients need to upload PDFs, the best option is to use the File Upload field instead. That field accepts a wider range of file types, including PDF, and you can also restrict it to only the file types you want.

Reach out again if you need any other help.

Forget PDFs, I get it. No PDFs.

But.. it accepts .BMP files. Not on the list you just mentioned. Can you please provide a complete list of ALL the file types allowed.

Hi DubStudio,

The Image Upload Preview widget is specifically designed for image files and primarily supports the most common web image formats. By default, the widget accepts: JPG, JPEG, PNG, GIF, BMP. You might also want to check out this guide, How to Add and Set Up the Image Upload Preview Widget on Your Form for more information.

Keep us updated and let us know if you need any more help.

Guys, is there any way PDFs can be added to this? Only today I had a client say:

"just to note, it wouldn't let me upload the PDF artwork labels and so I had to export PNGs for it."

I don't know why, but for some reason PDF seems to be the most common delivery format for graphic design: people use them as images.

Can somebody look into this? Is there some reason PDFs can't work?

According to google:

"Clients likely keep sending you graphic designs as PDFs because it is the industry standard for ensuring files look exactly as designed, regardless of the device or software used to open them. PDFs act as a secure, portable "container" that preserves fonts, colors, and layout, making them far more reliable than other formats for sharing and printing."

Hi DubStudio,

While the feature you're looking for isn't available at Jotform right now, we've gone ahead and escalated your request to our developers. Exactly when or if it's developed depends on their workload, how viable it is, and how many other users also request it. If there are any updates, we’ll circle back to this thread and let you know.

Thanks for your patience and understanding, we appreciate it.