What is the recommended way to embed PDF in HTML?
What does Adobe say itself about it?
In my case, the PDF is generated on the fly, so it can't be uploaded to a third-party solution prior to flushing it.
The easiest way to put PDF in an HTML document is using the <a> tag with its href attribute. You need to add the URL or the reference link of your PDF file to the element.
Using a Simple Link It uses an HTML <a> tag which links to the PDF document. This is, on the one hand, is great, as it delegates the responsibility of dealing with the PDF to the platform itself (e.g. your Mac or PC or phone).
The best way I found to display a PDF was to use an iframe. iframe stands for inline frame, and it allows you to embed another HTML document within the current one. You can read more about it here.
Probably the best approach is to use the PDF.JS library. It's a pure HTML5/JavaScript renderer for PDF documents without any third-party plugins.
Online demo: https://mozilla.github.io/pdf.js/web/viewer.html
GitHub: https://github.com/mozilla/pdf.js
This is quick, easy, to the point and doesn't require any third-party script:
<embed src="http://example.com/the.pdf" width="500" height="375" type="application/pdf">
UPDATE (2/3/2021)
Adobe now offers it's own PDF Embed API.
https://www.adobe.io/apis/documentcloud/dcsdk/pdf-embed.html
UPDATE (1/2018):
The Chrome browser on Android no longer supports PDF embeds. You can get around this by using the Google Drive PDF viewer
<embed src="https://drive.google.com/viewerng/ viewer?embedded=true&url=http://example.com/the.pdf" width="500" height="375">
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With