How To Make A Button Link To Another Page In HTML
Last Updated : Mar 11, 2024
IN - HTML | Written & Updated By - Pragati
In this tutorial we will show you how to make a button link to another page in HTML, sometimes, we face a problem in which we are unable to link a button to another webpage. Generally, as we know, a website is a collection of webpages and webpages are linked together with the help of HTML links.
The links may be of many types, but today we will discuss about linking of webpages with the help of buttons. As, we want to say that by clicking on a button we are redirected to another webpage.
Step By Step Guide On How To Make A Button Link To Another Page In HTML :-
As here, in this article we understand how to create a button that links to another webpage.
In result, we found that a button is displayed on a webpage and after clicking on this button we are directed to another webpage or in simple language by clicking on this button another webpage is opened.
A general use of button tag as a link to another webpage with the help of codes is given here...
<!DOCTYPE html>
<html>
<head>
<title> Title of the document<title>
</head>
<body>
<button onclick="document.location=’file_name.html’">
Sign in button
</button>
</body>
</html>
- First, we write <! DOCTYPE html> which we used as an instruction to the web browser about what version of HTML file is written in.
- Secondly, the <html> tag is used to indicate the beginning of an HTML document.
- As above now <head> tag is used to contain information about web page. In this tag a <title> tag is used which helps us to specify a webpage title. Both <head> and <title> tags are Paired tags. So, both have </head> and </title> ending tags respectively.
- <body> tag is used to define the webpage body. All the contents to show on website are written here. Here, we add a button by typing or creating a button tag.
- A button tag is used to display a button in webpage. It is a paired tag. So, it must have closing tag and text to show inside button is written in between these tags.
- Now, here we use some JavaScript codes to link another webpage inside button. So, that when we click on this button another webpage gets opened. For this we use onclick button attribute and inside this we type document.location attribute and inside this attribute we give the name of webpage which we want to open as its value with its extension.
- At last, the <body> and <html> tags are closed with </body> and </html> respectively.
Conclusion :-
At last, we want to say that we are able to create a button that’s act like a link which helps us to go to another webpage.
This all can be done with the help of JavaScript, we use some JavaScript code inside the HTML button tag and give the webpage name as value to its document.location attribute.
So, by clicking on the button we indirectly opens another HTML page. I hope this tutorial on how to make a button link to another page in HTML helps you and the steps and method mentioned above is easy to follow and implement.
About Pragati
