CODEWITHSUNDEEP
htmlpdfiframedropbox
ram
ram

Reputation: 27

HTML - embed pdf file from the dropbox with pdf viewer (online)

I have a link to pdf file that located in the my Dropbox folder. For example: https://dl.dropboxusercontent.com/1/view/gqo4etwy7nudtu2/JasperReports-Server-Visualize.js-Guide.pdf

By clicking on the link, I may download the file. I want to embed the file on my site. I use the following code:

<iframe src="https://dl.dropboxusercontent.com/1/view/gqo4etwy7nudtu2/JasperReports-Server-Visualize.js-Guide.pdf?preview" height="100%" width="100%">
This browser does not support PDFs. Please download the PDF to view it: <a href="https://dl.dropboxusercontent.com/1/view/gqo4etwy7nudtu2/JasperReports-Server-Visualize.js-Guide.pdf?preview">Download PDF</a>
</iframe>

I tried to set two files, the link above and another one that I found on Google. The link above unable to embed, and it's opened for download, all the other files embedded successfully.

How can I embed pdf file from Dropbox?

Upvotes: 1

Views: 4485

Answers (1)

Antonio Ooi
Antonio Ooi

Reputation: 1826

Found the Dropbox Embedder but not yet tested:

You need to create an account in the App Console and create an app to get the app key:

<script type="text/javascript" src="https://www.dropbox.com/static/api/2/dropins.js" id="dropboxjs" data-app-key="YOUR_APP_KEY"></script>

Then you embed a Dropbox PDF file with the anchor tag:

<a
  href="https://www.dropbox.com/s/u0bdwmkjmqld9l2/dbx-supporting-distributed-work.pdf?dl=0"
  class="dropbox-embed"
  data-height="300px"
  data-width="600px"
></a>

More info here.

Upvotes: -1

Related Questions