Connect with us

Development

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

Published

on

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:

Advertisement

– 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:

Opens Google.com in pop-up with no (optional) attributes. Opens Google.com in pop-up with only ‘menubar’ attribute included. Opens Google.com in pop-up with only ‘toolbar’ attribute included. Opens Google.com in pop-up with only ‘scrollbars’ attribute included. Opens Google.com in pop-up with all attributes included.
Advertisement
Comments