DEV Community

Lalit Kumar
Lalit Kumar

Posted on

How to make multiple pages in html

This tutorial can help you create inner pages in an HTML- based template.

1) Open your website folder and find a page that is best for your new sub-page - open each page in the browser and review its layout.

2) Copy and paste the chosen page in the same folder, rename it. Use English elements and numbers for page titles and headers.

3) Open the new page in your editor of HTML and make any necessary changes. Save it after editing.

4) After editing your new page you must open all the HTML pages and modify the link of the button that opens it. Note: You will have to edit all the pages that contain a button that opens the new page.


title: "How to make multiple pages in html"
tags: html

canonical_url: https://kodlogs.com/blog/2661/how-to-make-multiple-pages-in-html

The menu code can look like this:

<li><a href="more.html">Overview</a></li>

<li><a href="more.html">Small Business</a><ul>

<li><a href="more.html">Overview</a></li>

<li><a href="more.html">Small Business</a></li>

<li class="last"><a href="more.html">Corporate</a></li>
Enter fullscreen mode Exit fullscreen mode

5) Review your website and examine how it works. Your new page is updated and linked.

First, you must had an idea of ​​what you want to do ... if you really know it, the general thing is that every Web page has its "Home Page".

In your case, assuming you already have your Home Page and what you want is to show a gallery ... you could create them as follows ...

Page 0.html = HomePage
Page 1.html = Gallery
Page 2.html = Contact

To do the above, you must create three separate pages, but configure them in such a way that giving a site makes the redirect to that other part.

Example in your HomePage configures the word "Gallery" to go to page 1 which is where the gallery is.

Remember that it is a single project in a single folder, but you need to create each page individually as needed and create the links to navigate between them.

To redirect from Homepage to Gallery, assume that in the projects folder, the page having "Gallery" is called page 1.html.

On page 0, which is the one that contains the Home Page, you can put the following.

Click here to see the gallery

Then you enter the following code on page 0, which is the one that contains the Home Page so that it will take us to page 1 that has "Gallery". It is extremely important that everything is in the same folder ok.

<html>
<head>
</head>
<body>
<a href="page 1.html"> Click here to view gallery </>
</body>
</html>
Enter fullscreen mode Exit fullscreen mode

In the case of page 1, which contains "Gallery", you can put the following code.

Click here to return to HomePage

Then you will use this code on page 1

<html>
<head></head>
<body>
<a href = "page 0.html "> Click here to return to the HomePage </>
</body>
</html>
Enter fullscreen mode Exit fullscreen mode

Top comments (0)