Mobile app version of vmapp.org
Login or Join
Bethany197

: Common Header & Footer for HTML Site I'm about to re-work an old HTML-based site and would like to separate out the header and footer of the content into separate files as they'll be common

@Bethany197

Posted in: #Html #Iis7

I'm about to re-work an old HTML-based site and would like to separate out the header and footer of the content into separate files as they'll be common to all pages. The current site author just copied their index.html page and replaced the body text for each subsequent page, making changes to the menu and such a huge maintenance pain.

I could go the Server Side Includes (SSI) route and include a header file and a footer file into each page to strip out the common content, but that would require that I rename all files with the *.shtml extension right?

Any other options for doing the header & footer file inclusion without modifying the existing extensions (no dynamic content in the site, so going php or asp etc is not warranted).

(note: running IIS 7.5 as the web server)

10.03% popularity Vote Up Vote Down


Login to follow query

More posts by @Bethany197

3 Comments

Sorted by latest first Latest Oldest Best

 

@LarsenBagley505

If php is an option you can use the include statement to call your header and footer whenever you need to include them in a page using <?php include 'header.php';?>


The include (or require) statement takes all the text/code/markup
that exists in a specified file and copies it into the file that
uses the include statement. Including files is very useful when you want to include the same PHP,
HTML, or text on multiple pages of a website.
Including files saves a lot of work. This means that you can create a
standard header, footer, or menu file for all your web pages. Then,
when the header needs to be updated, you can only update the
header.php file.


Let's say we have a code for the header within a file called "header.php" that looks like this:

<header class="header">Welcome to my website!</header>


To include the header file in a page, use the include statement:

<html>
<body>

<?php include 'header.php';?>
<p>Some text.</p>
<p>Some more text.</p>
<footer class="footer"> ... </footer>

</body>
</html>


When to use include and when to use require?

The require statement is also used to include a file into the HTML/PHP code.

However, there is one big difference between include and require. When a file is included with the include statement and PHP cannot find it, the script will continue to execute, while when using the require statement a fatal error will be produced:


require will produce a fatal error (E_COMPILE_ERROR) and stop the the script
Use require when the file is required by the application.
include will only produce a warning (E_WARNING) and the script
will continue
Use include when the file is not required and application should continue when file is not found.

10% popularity Vote Up Vote Down


 

@Yeniel560

You can actually use any file extension for SSI (in fact, you can set up your server for any extension of your choosing to be parsed as any file type). Here is one such guide for IIS, it looks fairly simple.

For your use case it seems like that would be the best way. Using PHP or ASP.net is certainly worth considering though, as you can add more dynamic content in the future.

One other possibility would be to create your own "build process". You would extract the header/footer into separate files, then write a program (e.g. a PHP script) that adds them back to the HTML files and saves the results in another folder, as a self-contained site. Then you just upload that folder as the site. However, you would need to run your build script each time you modified a page, even a small change, so it may not be suitable.

10% popularity Vote Up Vote Down


 

@Ann8826881

You are still better to go down the PHP way with using:

<?php require_once "header.php"; ?>

<!-- page HTML here -->

<?php require_once "footer.php"; ?>


than changing to index.php even if there is no dynamic content on the website at this time. You may add dynamic content at a later date than will need to do it than anyway and have the same issue you have now with changing it at a later date.

10% popularity Vote Up Vote Down


Back to top | Use Dark Theme