Learn how to embed a PDF document in HTML web page as an inline view. Many users looking to display a PDF document on the website page, so here we bring simple ways to embed PDF on an HTML page.
We going to show two simple ways to embed PDF in HTML, let’s check it out.
Ways to Embed PDF in HTML page
1) Using Embed HTML tag:
In this, we can use <embed> HTML tag to show PDF files in the web page. This is a simple way to display PDF in an inline view.
Use the below code to embed a PDF file in the HTML page.
|
1 |
<embed src="somedocument.pdf" type="application/pdf" width="100%" height="500px" /> |
This <embed> tag have 4 parameters.
src – to specify PDF document path
type – mention media type
width – specify embedded PDF content width
height – specify embedded PDF content height
Embed PDF View Configuration using <embed> tag
For display control on PDF file on webpage, we can use some configuration parameters, check below
- page = pagenum (mention number of page in PDF file)
- toolbar = 1 or 0 ( Turn toolbar on or off)
- scrollbar = 1 or 0 ( Turn scrollbar on or off)
- statusbar = 1 or 0 ( Turn statusbar on or off)
- navpanes = 1 or 0 ( Turn navigation and tabs on or off)
- zoom = scale (set the zoom)
Some Example with View Configuration
|
1 2 3 4 |
your_pdf_file_source.pdf#page=3 your_pdf_file_source.pdf#page=3&zoom=200,250,100 your_pdf_file_source.pdf#zoom=200 your_pdf_file_source.pdf#page=10&view=fitH,100 |
2) Using iFrame HTML tag to embed pdf in html
Another way to embed a PDF in HTML is using <iframe> tag. This is also commonly used to view PDF documents in HTML webpage. This method to embed PDF is compatible with IE8, Firefox, Chrome, and other browsers.
Example <iframe> embed a pdf HTML code:
|
1 |
<iframe src=”sampledocument.pdf#page=2" width=”100%” height=”100%”></iframe> |
Also Read:
PHP Convert Html to PDF using DomPdf
PHP Code to Extract Text and Images from a PDF file
How to Convert HTML to PDF Document in PHP using fpdf
In conclusion, both ways are being able to embed a pdf document in HTML webpage. Being able to embed a pdf HTML code can be used to create beautiful displays of interactive documents.
