(Html) Download a Pdf File Instead of Opening Them in Browser When Clicked

(HTML) Download a PDF file instead of opening them in browser when clicked

There is now the HTML 5 download attribute that can handle this.

I agree, and think Sarim's answer is good (it probably should be the chosen answer if the OP ever returns). However, this answer is still the reliable way to handle it (as Yiğit Yener's answer points out and--oddly--people agree with). While the download attribute has gained support, it's still spotty:

http://caniuse.com/#feat=download

is it possible to make an hyperlink to only download a pdf file?

Let’s say you have a PDF that you want to let people download. The file will be like this:

<a href="/path/to/your/receipt.pdf">Download Receipt</a>

In most browsers, clicking on the link will open the file directly in the browser.

But, if you add the download attribute to the link, it will tell the browser to download the file instead.

<a href="/path/to/your/receipt.pdf" download>Download Receipt</a>

The download attribute works in all modern browsers, including MS Edge, but not Internet Explorer.

In the latest versions of Chrome, you cannot download cross-origin files (they have to be hosted on the same domain).

How to force a Download File prompt instead of displaying it in-browser with HTML?

This is something that you cannot absolutely control with HTML itself.

If the user is having a browser with PDF reading capabilities (or a plugin) and the corresponding settings to open PDF files in-browser, the PDF will open like that.

The PDF opens in a new tab simple because of your target="_blank", which has nothing to do with a download prompt.

If you are using HTML5 you can use the download attribute:

<a href="sample.pdf" download="sample.pdf">Download</a>

If you have a back-end service which you can control or you feel like fiddling with your Web Server, you can always look for setting the right Content-Disposition. See this SO question for some nice discussion on Content-Disposition.

Opening files in browser instead of downloading

add target="_blank" to get a new window. adding .pdf may help. If you have control over the host web server adjusting the headers for the files in question will also help it open inline. I can tell you what headers to set if you are able too

---

Related Topics