How to force PDF downloads using HTML5

Wondering how to force PDFs to download rather than load in another tab (as Chrome currently does)? While there are other proposed solutions —some involved adding code to your .htaccess file — there is a very elegant solution using the HTML5 anchor element download.

How it works:

The download attribute tells compliant browsers to download the anchor link using the specified download attribute name.

HTML Example:

Instead of

<a href="">Download this PDF</a>

Use the download attribute:

<a href="" download="My Awesome PDF.pdf">Download this PDF</a>

The above HTML code will tell the browser to download the linked PDF file using the download attribute value as the name. Without the download attribute, some browsers (notably Chrome) will load PDFs in another tab.

Leave a Reply