How to Put a PDF Document on Your Website

By Kevin Lee

There are two ways to put a PDF on your website: You can add a link to one or embed an actual PDF document inside a Web page. The method you choose depends on your design goals. If you have a PDF that you always want visible, embedding it might be a wiser option. On the other hand, you may not wish to load a PDF into a Web browser if a user might not need to see it. Using HTML, you can link or embed a PDF on your website.

Step 1

Launch an HTML editor and open an HTML document.

Step 2

Paste this code into that document's "body" section:

Your browser does not support PDFs
The "object" tag embeds a PDF into the Web page. Replace "xyz.pdf" with the URL of a PDF that resides on the Web. For instance, if the PDF is on your own Web server and the PDF's URL is "," make the code appear as follows:
Your browser does not support PDFs
Note that the object tag references a CSS class named "pdf."

Step 3

Place the following HTML code below the previous code:View external link to PDFThis creates a hyperlink. Replace "xyz.pdf" with the same URL to the PDF you specified previously.

Step 4

Paste the code shown below in the document's "head" section:This creates the "pdf" class referenced by the object tag in the body section. This class allows you to set the PDF's height and width. In this example, those values are 400 pixels and 500 pixels. Change these to other values to change the dimensions of the PDF viewer.

Step 5

Save the document and open it in a browser. The PDF appears. Click the link that appears on the page. Your browser navigates to the same PDF document.

Tips & Warnings

  • Note that the "object" tag contains the text, "Your browser does not support PDFs." This is default text that appears if a user's browser does not support PDF viewing. You can change that text to suit your needs.