Embed PDF in HTML

Chances are you’ve come across a website, and within that website appears a PDF image. Perplexed, you wonder how in the world they were able to do it. Lucky for you, we’ve got you covered with these simple instructions on how to embed PDF in HTML into your website.

pdf

But first, why embedding?

Say you want to read the actual words of the Supreme Court’s latest decision. Do you want a truncated version authored by an “expert” or law student? Or do you want the actual holding written by one of the justices? Relying on third-party material can be dangerous. People, after all, tend to write with bias. That is, they tend to analyze materials based on their own experiences, often interjecting important points with their own opinion. Though helpful, using other people as a source can mislead your readers if proper care isn’t considered.

Fortunately, there are options available that will help you avoid bias: embedding actual documents using a simple HTML code.

Avoiding bias helps build reader confidence in your material, reader confidence helps you build a reputation. How does it work? It works like a JPG image or any other embedded image. In other words, the code sends a message to your source (online database of PDF’s location) and transfers that source into a readable image. After it has imaged itself, the code tells it to allow PDF downloads of the image. Voila!

Not only does the PDF show up on your page as an image, it also becomes downloadable to your site’s users.  Use this very simple PDF code to embed a PDF file into your website:

  1. Open the HTML code on the page you want to embed the PDF on
  2. Go to the exact location where you want the image to appear
  3. Add this code: <embed src=”The_URL_Where_PDF_Is_Located.PDF” width=”550″ height=”750″> </embed>

Add URL of PDF in the source field. Width and height can be adjusted to your liking. Go ahead and experiment with different sizes. Make sure to check display before publishing. You can do this by saving your work as a draft and previewing it.

Given below is an example of one such PDF file found on the Supreme Court’s website using this simple code.

<embed src=”http://www.supremecourt.gov/docket/No5UnitedStatesvCalifornia.pdf” width=”550″ height=”750″> </embed>