Create a website link button

Create a website link button:
In this tutorial we will create a clickable button with an onclick event that will link to a web site address.

If you want to follow the tutorial please download tutorial template here
If you are following these tutorials continue to use your own source code from previous tutorial.

Firstly we will add a value to the button. The value attribute specifies the initial value of the button and it will be used by some browsers.

<button type="button" value = "My Programing Journey"></button>

Next we will be using window.location with our onclick event when the button is clicked. A website URL will be assigned to the window.location.
In this tutorial I am using my home page address, you assign your own URL in place of mine.

<button type="button" value = "My Programing Journey" onClick = "window.location ='your URL goes here'"></button>

Finally add the text that you want displayed on the button in between the opening and closing button tags.

<button type="button" value = "My Programing Journey" onClick = "window.location ='http://myprogramingjourney.blogspot.ie/'">My Programing Journey</button>

Save your HTML document and test on browser of choice. If you wish to continue following the tutorials type Yes into the table data column after Create a website link button in the completed tutorials table.

<tr>    <td>Create a website link button</td>    <td>Yes</td> </tr>

To download the finished example for this tutorial please click here

Previous tutorial