Insert a Download Button in Blog Posts to Open Links in Popup Window

A download button is used whenever we want to hide a link from the users. It can be a link to any website or link to any file that you want to hide. It also makes a download link prominent so a reader doesn’t have to find the actual download link in a lengthy blog posts.

It’s a simple HTML “type” tag that creates this clickable button to open the embedded link in a pop up window.

So if you want to put a button in your blog or in your blog posts all you need to do is to insert the code below wherever you want to show a button.


<input value="TEXT on the button" onclick="window.open('http://URL-ADDRESS-HERE','ANY-UNIQUE-NAME',' width=750,height=550, menubar, toolbar, scrollbars')" type="button">


Customizations:

– Change the text in red to the text you want to show on the button.
– Blue is the URL address you want to open after the click of the button.
– Green is any unique id you can give to that button. (giving this id is important, otherwise link will open in a new browser windows instead in a pop-up window.)
– Yellow are the width and height of the popup window that opens after button’s click.
– In pink colors are the optional attributes you can give to the popup window.

Removing the menubar, toolbar or scrollbars will remove these bars from the popup window.

Examples: