All TalkersCode Topics

Follow TalkersCode On Social Media - A Social Media Network for developers Join Now ➔

How To Make A Button Link To Another Page In HTML

Last Updated : Mar 11, 2024

How To Make A Button Link To Another Page In HTML

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>
          <title> Title of the document<title>
       <button onclick="document.location=’file_name.html’">
	Sign in button
  1. First, we write <! DOCTYPE html> which we used as an instruction to the web browser about what version of HTML file is written in.
  2. Secondly, the <html> tag is used to indicate the beginning of an HTML document.
  3. 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.
  4. <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.
  5. 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.
  6. 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.
  7. 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.

Author Image About Pragati

Experienced coding content writer who enjoys breaking down complex concepts in programming languages like Java, Python, C, and C++. Over three years of experience producing interesting and relevant content for a variety of entities. Committed to providing concise and easy-to-understand articles that assist readers in easily understanding technology and industry trends in the world of coding and software development.

Follow Pragati On Linkedin 🡪