Add PDF Files to Websites

6 Simple Steps to Add PDF Files to Websites

Young woman using laptop in cafe
Fabian Laghi/Iconica/Getty Images
Was this page helpful?

Have you created a PDF program using Adobe Acrobat that you think your readers will benefit from? Did you get permission to add a link to a PDF file on your website? This is how you add the PDF file to your website so your readers can open it or download it.

1. Make Sure PDF Files Are Allowed - Some hosting services don't allow files over a certain size and some don't allow you to have certain types of files on your website; this might include PDF files.

Make sure that what you are about to add to your website is allowed by your web hosting service first. You don't want to get your website shut down for not following the rules or do a lot of work getting ready to add the PDF file to your website only to find out you can't. 

If your hosting service does not allow you to have PDF files on your website, you can get your own domain name for your website or switch to another hosting service that does allow PDF files or large files on websites.

2. Upload PDF File to Your Website - Upload your PDF files to your website using the easy file upload program that your web hosting service provides. If they don't provide one, then you need to use an FTP program to upload your PDF file to your Web site.

3. Find Your PDF File's Address (URL) - Where did you upload the PDF file to? Did you add the PDF file to the main folder on your website or to another folder?

Or, did you create a new folder on your website just for PDF files? Find the address of the PDF file on your website so you can link to it.

4. Choose a Location for Your PDF File - Which page on your website, and where on the page, do you want the link to your PDF file to be?

5. Find the Location of the PDF File in Your HTML - Look through the code on your webpage until you find the spot where you want to add the link to your PDF file.

You may want to add <p> before you enter the code, for the link to your PDF file, to add a space.

6. Add the Link to the PDF File - Add the code to the place where you want the link to the PDF file to show up in your HTML code. It's actually the same link code that you would use for a normal web page link. You can make the text for the PDF file link say anything you want it to. For example:

  • Your website is hosted at Freeservers
  • The username for your website is "sunny"
  • Your website is located at http://sunny.freeservers.com
  • You uploaded the PDF file to the main directory in your file manager on your website
  • The PDF file is called "flowers.pdf"
  • The text you want the reader to click on to download the PDF file is "Click here for the PDF file called flowers."
  • Your code will look like this:

    <a href="http://sunny.freeservers.com/flowers.pdf">Click here for the pdf file called flowers.</a>

  • If you had uploaded the PDF file to a folder called "fun", the code for the link to the PDF file would look like this instead:

    <a href ="http://sunny.freeservers.com/fun/flowers.pdf">Click here for the pdf file called flowers.</a>

7. Testing The PDF File Link - If you are creating your website on your computer, before downloading the the PDF file to your server, test the link to the PDF file to make sure it works properly.

You will need to link to the PDF file on your hard drive like this:

  • The PDF file is located in the "My Documents" folder
  • It is called "flowers.pdf"
  • The text for the pdf file says "Click here for the pdf file called flowers."
  • Code is: <a href ="file:///C|/My Documents\flowers.pdf">Click here for the pdf file called flowers.</a>