Streaming live at 10am (PST)

Pdf view in webflow

Good evening. Is it possible to upload a pdf file to a Webflow made website, where it can be viewed on the page, without having to download it to read? Thanks.

This post from a while back might be if interest to you.

1 Like

Drew shared a good thread.

TLDR; from

**0. Install pdfobject.js to your project / github / cdn **

1. Create a container to hold your PDF

<div id="pdf_wrapper"></div>

2. Tell PDFObject which PDF to embed, and where to embed it

<script src="/js/pdfobject.js"></script>
<script>PDFObject.embed("/pdf/sample-3pp.pdf", "#pdf_wrapper");</script>

NOTE: reference pdfobject.js cdn for the js OR copy the '<'script>into the head tag.

3. You can optionally use CSS to change the appearance of the containing element, such as height, width, border, margins, etc.

<style>
.pdfobject-container { height: 30rem; border: 1rem solid rgba(0,0,0,.1); }
</style>

There are also alternative ways to do this
Embed

<embed src="../pdf/sample-3pp.pdf#page=2" type="application/pdf" width="100%" height="100%">

IFRAME

<iframe src="../pdf/sample-3pp.pdf#page=2" width="100%" height="100%">
This browser does not support PDFs. Please download the PDF to view it: 
<a href="../pdf/sample-3pp.pdf">Download PDF</a></iframe>

@miekwave it looks like you’re hosting custom JS files directly in webflow? If that’s the case how did you do it? It also looks like you have figured out how to create a URL that ends in .pdf? if that’s the case how did you do it?!?