Is it possible to store 'html' code in another page like a stylesheet?

Question

just wondering if there was like a stylesheet for 'html'. What if I have a second 'html' file which contains a lot of the same 'html' as the first one. Instead of copying and pasting all the different bit can I use something like a stylesheet to store and make that 'html' appear on the second page?

http://stackoverflow.com/questions/8988855/include-another-html-file-in-a-html-file — Andrew Truckle, Mar 27 '16 at 06:02

AndrewL64 · Answer 1 · 2016-03-27T06:26:46.433

1

PHP METHOD: Just rename your html file from fileName.html to fileName.php so you can use php include for templating your site.

Here's an example of keeping the same navbar, say navbar.php on all pages:

navbar.php:

<ul>
  <li>Home</li>
  <li>About</li>
  <li>Contact</li>
</ul>

The above will be added to every page including the file.

INDEX.PHP:

<div class="nav">
    <?php include("pathTofile/navbar.php"); ?>
</div>

<div class="banner">
    ....
</div>

ABOUT.PHP:

<div class="nav">
    <?php include("pathTofile/navbar.php"); ?>
</div>

<div class="someDiv">
    ....
</div>

CONTACT.PHP:

<div class="nav">
    <?php include("pathTofile/navbar.php"); ?>
</div>

<div class="someDiv">
    ....
</div>

So if you need to make some edit to your navbar, you can just edit the navbar.php file and the changes will be reflected on all pages.

edited Mar 27 '16 at 06:26

answered Mar 27 '16 at 06:19

AndrewL64

13,967
6
36
64

but but ..the OP hasn't added a `php` tag – Rajshekar Reddy Mar 27 '16 at 06:28
@Reddy Agreed. But this method is the cleanest method to achieve what he want. But if he sees this and states that he doesn't want to use PHP, then I will delete this :) Cheers – AndrewL64 Mar 27 '16 at 06:33
1

this will limit the idea to only Php users. I think using jquery you can just say `$('div').load()`. it would be acceptable by wide crowd. – Rajshekar Reddy Mar 27 '16 at 06:35
1

@Reddy Googling it now. Will incorporate it to the answer too. Thanks for the heads up bro. – AndrewL64 Mar 27 '16 at 06:41

Philip Kirkbride · Answer 2 · 2016-08-11T18:50:01.927

This isn't possible using HTML alone but many server-side and client-side frameworks like PHP, Node.js, and Django allow you to insert one HTML file into another for example using the same header across a website.

Or you could use JavaScript to import the file. Here is an example using the jQuery library:

<html>
  <head>
    <script>
      $("#header").load("header.html");
    </script>
  </head>
  <body>
    <div id="header"></div>
  </body>
</html>

Is it possible to store 'html' code in another page like a stylesheet?

2 Answers2