Recommended way to embed PDF in HTML?
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">
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
You can also use Google PDF viewer for this purpose. As far as I know it's not an official Google feature (am I wrong on this?), but it works for me very nicely and smoothly. You need to upload your PDF somewhere before and just use its URL:
<iframe src="http://docs.google.com/gview?url=http://example.com/mypdf.pdf&embedded=true" style="width:718px; height:700px;" frameborder="0"></iframe>
What is important is that it doesn't need a Flash player, it uses JavaScript.
You do have some control over how the PDF appears in the browser by passing some options in the query string. I was happy to this working, until I realized it does not work in IE8. :(
It works in Chrome 9 and Firefox 3.6, but in IE8 it shows the message "Insert your error message here, if the PDF cannot be displayed."
I haven't yet tested older versions of any of the above browsers, though. But here's the code I have anyway in case it helps anyone. This sets the zoom to 85%, removes scrollbars, toolbars and nav panes. I'll update my post if I do come across something that works in IE as well.
<object width="400" height="500" type="application/pdf" data="/my_pdf.pdf?#zoom=85&scrollbar=0&toolbar=0&navpanes=0">
<p>Insert your error message here, if the PDF cannot be displayed.</p>
</object>