Thursday, 8 December 2011
How to embed a PDF document into HTML web page
PDF the Portable Document Format, although created by Adobe in the early 90's is now an open standard ISO format for documents.
It's a great way of converting propriety documents (excel, word etc.) into a easily viewable/exchangable format.
Putting PDFs into web pages is increasing popular - you can view documents as they should appear with images and text formatted as the author intended.
So.. how do you embed a pdf into a web page?
The simple way is to use the <object> element.
This assumes that the web browser has a PDF plugin - if not you can add a message to allow a direct download of the PDF instead.
<object data="filename.pdf" type="application/pdf" width="100%" height="100%">
<p>Your web browser doesn't have a PDF plugin.
Instead you can <a href="filename.pdf">click here to
download the PDF file.</a></p>
You can then style the div that this object goes in so that it fits with the size and layout of your website.
If you're still not sure, or want more detail about this subject read the info over at pdfobject.com