Is there a tutorial or simple guide on embedding a PDF into a Webflow page? I've checked out the Webflow announcement about uploading PDFs, PPTs, DOCs, CSVs, and more, but I'm still having trouble figuring it out. Can someone assist me?

TL;DR

Upload your PDF to Webflow's Assets panel and copy the file URL.
Add an Embed element, paste an iframe code with the PDF URL, then publish and verify the PDF displays inline; use a host that supports iframe embedding if needed.

You can now upload and link files like PDFs directly in Webflow, but to actually embed a PDF document into a Webflow page so it displays inline (rather than as a downloadable link), you'll need to use a workaround.

1. Upload the PDF to Webflow

Go to Webflow Designer.
In the Assets panel, click the Upload icon.
Select your PDF file to upload it.
Once uploaded, click the asset and copy the file URL (this will be needed for embedding).

2. Embed the PDF Using an Embed Element

In the Designer, drag and drop an Embed element onto the canvas.
Paste the following embed code in the Embed field, replacing YOUR_PDF_URL_HERE with your uploaded file’s URL:
<iframe src="YOUR_PDF_URL_HERE#toolbar=0&navpanes=0&scrollbar=0" width="100%" height="600px" loading="lazy"></iframe>
Click Save & Close.

Tip: You can adjust width, height, and the #toolbar=0 settings to customize the PDF viewer’s behavior.

3. Publish and Verify

Publish your site, then view the live page.
Your PDF should be displayed inline within the iframe.

If you see a "refused to display" error, your PDF host (e.g., AWS, Dropbox, or even Webflow's CDN) may have X-Frame-Options headers blocking it. If that happens, consider using Google Drive or a PDF hosting service with iframe support.

Summary

To embed a PDF in Webflow: upload the PDF, get its URL, use an Embed element with an <iframe>, and ensure the URL allows iframe embedding.

Webflow Resources

Webflow templates

Webflow inspiration

Rate this answer

Other Webflow Questions

How can I resolve scrolling issues with a dropdown list in Webflow, specifically with a 13" Mac screen that cannot scroll to the bottom of the list?

How can I enable payment for hosts on my Webflow marketplace, similar to Airbnb, using the CMS feature?

Where can I find the CSS class "wf-section" in Webflow, as it is used in a downloaded template but not listed in any of the stylesheets?

Is it possible to set the viewport in Webflow's code to address the mobile usability issue flagged by Google Search Console? Is this warning something I should be concerned about? Thank you!

What is causing the intermittent 504 gateway timeout issues in our Webflow CMS? We have conducted health checks and observed a pattern of occurrences.

How can I set the scroll offset on my Webflow page with a sticky navbar, since the offset is not automatically adjusted when using "position:sticky"?

What could be causing my Webflow site to not be indexed by Google, despite following the guidelines and everything appearing to be in order?

Where can I modify the settings in Webflow to display my desired content instead of showing the template or Webflow name (as seen in the attached screenshot)?

How can I retrieve a Live Item ID and update the corresponding row in Google Sheets using Zapier integration with Webflow?

How can I download a PDF file automatically by visiting a link with no suffix using Webflow's hosting?

Why are the items after the load more button appearing twice when combining the finsweet attributes 'CMS filter' and 'CMS Load' in Webflow?

Can I build a Webflow site that pulls content from my own CMS through an API (JSON or XML)?

Is there a way to update Webflow CMS content items when a record in Airtable changes?

Does anyone have experience building a custom video lightbox in Webflow that starts playing a Vimeo video when a button outside the lightbox is clicked?

Which Webflow subscription would be the most suitable for a hosting and development service that plans to have separate website plans for each customer in the workspace?

Can Webflow be used to call a CSS or JS file stored on a different server, instead of hosting them on GitHub?

How can I dynamically redirect to a CMS created after form submission in Webflow?

In Webflow, how can I hide specific elements in the footer (such as "Ramin Khaze The Difference" and "Schedule showing") when the URL contains a certain parameter, such as "?mls"? I am a beginner in coding and would appreciate any help. Thank you!

How can I prevent the "w-current" class in Webflow from overriding the height of my custom class on a link block element?

Can I capture a screenshot of a Webflow page on click and convert it to a downloadable PDF?

How do I mirror user input from a form field to a non-form text field on the same Webflow page in real-time using JavaScript?

How can I close a dropdown in Webflow when clicking on a link?

Is there a more optimal way to create a portfolio section with a sticky image container that changes as you scroll, similar to the design on Deveb's website, that works across different web browsers, especially Safari, using Webflow or any other JavaScript tools?

How can I implement a multi-select field with a pre-selected option in a popup form on a collection page using Webflow?

How can I alternate the layout of the image and heading for each collection item in a two-column format on Webflow?

How can I execute JavaScript code when clicking a specific button with a given ID in a Webflow project?

How can I disable the Webflow success or failure state for a sign-up form and display a custom thank you page using jQuery and the Webflow form submit state?

How can I create a vertical scrolling menu with Webflow, similar to the one on Apple's website, that switches to horizontal scrolling when the menu doesn't fit on one screen?

How can I change the language of the Google Maps embed from English to Arabic in Webflow?

How can I reduce the vertical space between lines within a bullet point in Webflow? Can I replace the bullet points with icons on the "Services" page?