How to create a link to open a PDF file in new tab [HTML]

Steps to create a HTML link to open a PDF file in new tab. It opens PDF file in new tab on a single click.

HTML text link to open a PDF file in new tab

For example, below is the PDF file path

http://example.com/open-pdf-in-new-tab-html.pdf

HTML code to open above PDF file in new window or tab is

<a href=”http://example.com/open-pdf-in-new-tab-html.pdf” target=”_blank”>Open/Read PDF</a>

Above code creates a text link with name “Open/Read PDF” (as shown in below pic). So, when the user clicks on that link, the PDF file opens in a new tab or browser window.

photo of link to open a PDF file in new tab or browser window

HTML button to open PDF file in new browser window

If you want to add button instead of text link, then use below code

<button type=”button” ><a href=”http://example.com/open-pdf-in-new-tab-html.pdf” target=”_blank”/> Open/Read PDF</button>

Above code displays a HTML button link (see below image)

button link image to open a PDF document in new browser window

Note: I used example.com link. Please replace it with your desired PDF link or URL path.

Also see HTML code to download PDF file on single click

About the Author

SRINI S

A passionate blogger. Love to share solutions and best practices on wordpress hosting, issues and fixes, excel VBA macros and other apps