How to Display a PDF Document on Your Form

March 26, 2024

There are two ways to display a PDF document inside a form. The first method uses the PDF Embedder Widget to display the PDF. The second is embedding the PDF directly via an iframe using the Paragraph element.

Youtube Embed Poster: Phqm2rqC3m4

Update

We are excited to announce that we have just released the new version of Jotform PDF Editor.

How to Use the PDF Embedder Widget

Using the PDF Embedder widget is highly recommended as it is straightforward and doesn’t require any technical knowledge to set up. Here’s how:

  1. Click the Add Form Element button in the Form Builder.
  2. Go to the Widgets tab.
  3. Search for “PDF Embedder” from the list.
  4. Click or Drag and Drop the PDF Embedder to add.
Jotform pdf embedder widget
  1. Under the General tab of the PDF Embedder widget settings, click the Upload File button.
  2. Assuming the PDF file is in place, click the Update Widget button at the bottom to save the settings.
Jotform pdf embedder upload file

How to Embed a PDF Document Using Iframe

If you wish to load the PDF file outside, for example, on your server or cloud storage, you could use the iframe method. You only need the secure (HTTPS) link to the PDF file. Here are the steps:

  1. In the Form Builder, add a Paragraph element to your form.
  2. Click the Source code icon from the toolbar of the Paragraph element.
Jotform paragraph element source code
  1. Paste the following code in the Source code window:
<p>
<iframe style="border: none; width: 100%; height: 500px;" 
src="{url}"></iframe>
</p>
  1. Replace {url} with your PDF document’s link from your server or cloud storage. You can also change the width and height values at your discretion.
  2. Click the Ok button to save the changes.
Jotform paragraph element source code iframe

Here’s a demo form showing both methods: https://www.jotform.com/220642685583058

Comments and suggestions are welcome below. If you have a question, post it in our Support Forum so we can assist you.

Contact Support:

Our customer support team is available 24/7 and our average response time is between one to two hours.
Our team can be contacted via:

Support Forum: https://www.jotform.com/answers/

Contact Jotform Support: https://www.jotform.com/contact/

Send Comment:

Jotform Avatar
This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.

Comments:

  • Koelsch - Profile picture
  • avheadconsulting113 - Profile picture
  • NAR F.I.R.S.T. Surveys - Profile picture
  • QSESolutions - Profile picture
  • Marky - Profile picture
  • Subspecialty - Profile picture
  • BRIAN FLORA  - Profile picture
  • postfacility - Profile picture
  • arielganrek - Profile picture
  • CC - Profile picture
  • bplmtHRConnect - Profile picture
  • edorathy - Profile picture
  • Comprehensive401 - Profile picture
  • Comprehensive401 - Profile picture
  • jgroot - Profile picture
  • Mike - Profile picture
  • hatmakh - Profile picture
  • darapareddy2007 - Profile picture
  • genierose - Profile picture
  • genierose - Profile picture
  • arronlee - Profile picture
  • arronlee - Profile picture
  • pakkayu - Profile picture
  • halh - Profile picture