Jotform makes it easy to display PDF documents directly on your form so users can view them without having to download anything. Whether you want to show a contract, an instruction sheet, or any other document, embedding a PDF keeps everything in one place and makes it easier for form fillers to access the information they need.
There are two ways to do it:
Displaying PDF Document Using the PDF Embedder Widget
The PDF Embedder widget lets you upload and embed a PDF file directly into your form. Here’s how to set it up:
- In Form Builder, click on Add Element on the left side of the page.
- Now, in the Form Elements menu, under the Widgets tab, search for PDF Embedder and then click on it. Or just drag and drop it to where you want it on your form.
- Next, in the Widget Settings menu that opens on the right side of the page, under the General tab, click on the Upload File button, and then select the file from your device to upload. Or, drag and drop the PDF file to the file upload canvas.
- Once you’re done, click on Update.
That’s it! Your PDF document is now displayed directly on your form, making it easily accessible to users without requiring a download. You can explore how it looks with this demo form.
Pro Tip
- You can also check the Attach to Submission option to link the PDF to both the Thank You Page and the Emails of your form.
- For advanced styling of the PDF Embedder widget, you can add your own custom CSS code under the Custom CSS tab in the Widget Settings. Our guide on How to Inject CSS Codes to Widgets walks you through everything.
- You can also configure the widget properties, like alignment, labels, size, visibility, and more, to control how it looks and behaves in your form. Check out our guide on How to Access and Configure the Question Properties of a Widget to learn more.
Displaying PDF Document Using the Paragraph Element
If you have a PDF hosted on a server or cloud storage, you can embed it into your form using the Paragraph element and a simple HTML code. Here’s what to do:
- First, copy this code:
<iframe
src="{url}"
width="100%"
height="500"
style="border:none;">
</iframe>Note
Replace {url} with your PDF document’s link from your server or cloud storage. You can also adjust the width and height values to fit your form’s layout.
- Next, in Form Builder, click on Add Element on the left side of the page.
- Then, in the Form Elements menu, under the Basic tab, scroll down and then click on Paragraph. Or just drag and drop it to where you want it on your form.
- Now, click on Click to Edit this Text or the Pencil icon to start adding and formatting your text.
- Next, in Paragraph’s Rich Text Editor, click on the Source Code icon.
- Then, in the Source Code window that opens, paste the code in the Source Code Input box and click on OK.
- Finally, click on the Encircled Checkmark icon and you’re done.
That’s it! Your PDF document is now embedded and visible directly on your form. Depending on the method you used, form fillers can view the PDF without leaving the page or needing to download anything. Wondering how it looks in action? Check out this demo form.
Pro Tip
- If your PDF is stored in Google Drive, make sure the sharing settings are set to Anyone with the link so it loads correctly on your form.
- If you want to create a PDF version of your submitted forms, you can use our Jotform PDF Editor to learn more about it.
Send Comment:
25 Comments:
January 9, 2026
i do get emails about events other organizations run but use jotform as the data collection tool. the challenge i've seen in all of those times I needed to respond via jotform is that when there is an embedded pdf, it does not show up in firefox (which is my default browser) but does show in chromium (my alternate). Where can I file a bug report?
August 22, 2024
In the demo showing both options, the iFrame embed option is not working
July 10, 2024
I am not sure if my Independent Documentary Association (ida) application using create your Jotform with PDF attached was successfully submitted with invite notification.
August 26, 2022
Is there a way to delete an embedded PDF if you used Iframe?
November 17, 2021
How do you embed pdf file for viewing only with no download option.
November 19, 2019
Hi,
I'm trying to utilize the PDF Embedder as a selection (radio button) that whenever some chooses a certain PDF (3 selection) that certain PDF then gets attached to the submission,
Can someone help me achieve this please?
September 11, 2019
Hello,
I am attempting to include a fillable PDF inside of a form. The function of the PDF is for people to fillout the fields within the PDF and submit along with uploaded documents. After tested the pdf embedder widget, the fillable pdf shows up as blank. Is there a solution to this? Please advise.
June 12, 2019
I never know is this pdf or what
January 30, 2019
So confused...All I want to do is attach a fallible PDF to my form and its impossible. What is the best solution for what I am trying to do?
May 17, 2018
I am trying to use this method to display an external html page. But when I insert the code with the iframe and press ok, the code is simply not saved and when I edit it again, nothing appears.
January 22, 2018
Is it possible to display pdf files in local computer?When I try to display pdf files in my local computer, error is shown like that 'not allowed to local resoutces'. How do I do?
September 20, 2017
Can someone assist me as to how can I insert a PDF uploaded in Jotform with Google Forms ?
August 25, 2017
We need the person filling out the form to be able to download the PDF to keep it. Is there capability to do this?
April 18, 2017
I am sorry but I realized my problem was my error. I didn't notice at the bottom of the page I had to update widget. It works fine now. Thank you!
April 18, 2017
I used the Widget PDF embedder and uploaded the pdf onto page two and page 2 is blank. I didn't get an error and everything appeared to work but page 2 has nothing on it. What can I do?
March 27, 2017
Hi - can you update instructions for the new version? thanks!
August 24, 2015
Your URL https://www.jotform.com/adobe-formscentral-alternative/ does not seem to be active. I downloaded some Adobe FormsCentral templates and would like to import them to Jotform. Can it be done?
April 23, 2015
I get a "page not available" error everytime I create a pdf from my form. Below is the "details" of the error:
might be temporarily down or it may have moved permanently to a new web address.
Any suggestions?
December 26, 2013
The example form says :
Form not found
This form has been deleted by the owner.
Try contacting the owner of this form.
December 9, 2013
Well, I was able to embed the form using a widget. However, There are a few problems. I have viewed the form on Firefox, Chrome, and Safari and can't fill out the form with any of those browsers. The interactive function of the form seems to have disappeared. Also, I can't get rid of the word "Click here to edit" because when I delete those words the form is also deleted.
When I view the form on Internet Explorer 11 this is what I get:
"This content cannot be displayed in a frame
This content cannot be displayed in a frame. To help protect the security of information you enter into this website, the publisher of this content does not allow it to be displayed in a frame."
You can view my form here:
The form I imported is here:
December 9, 2013
I have not been able to import my PDF interactive form into the text area because of error 404. However, the error window gives the URL of the form; I copied the URL and pasted it and the form come up, so I know that it is available and the URL is entered correctly.
Also, when I click on "text" the HTML button that is shown in the above instructions is not there and so I clink on edit html which is in the text area and enter the iframe there. (The instructions are not what I see on my screen).
I hope you can help me be able to help me.
Thank you.
July 22, 2013
Thanks for your nice sharing. But I used to display PDF files with the help of a whose way of processing is simple and fast. And I will try your sharing later.
July 22, 2013
Thanks for your nice sharing. But I used to display PDF files with the help of a [url= reader SDK[/url] whose way of processing is simple and fast. And I will try your sharing later.
February 27, 2013
Sorry that isnt working for me. Ot just doesnt show anything or it removes the closing i frame tag.
thanks
Woody
May 17, 2012
The solution 11474017239 displays properly in Windows 7 browsers, IE8, Firefox 10-12, and Google Chrome 18. However the pdf file does NOT display on the Mac browsers, Safari 5.17 and Firefox 12. It does display in Mac Chrome 18