Tara
Tara

Reputation: 1598

How do You Call Header.html/Footer.html in a Web Page?

I've been making a website with about 25 pages and every time I want to update the nav bar, or the footer, I have to go through every page and make the change!

Surely there is a way to have the header and the footer (and the side bar!) in separate documents and call them in the same way a CSS is called so they don't have to be repeated on every page.

Bonus: Is this likely to affect SEO in any way? Might it slow down the site?

Thank you,

Tara

Upvotes: 0

Views: 7219

Answers (2)

Lawrence Cherone
Lawrence Cherone

Reputation: 46650

by using include():

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Your page</title>

<style type="text/css">
<!--Your styles ect that make your page-->
</style></head>

<body>

<div class="container">
  <div class="header"><?php include('./site_content/header.html');?></div>
  <div class="sidebar"><?php include('./site_content/sidebar.html');?></div>
  <div class="content">
  your content
  </div>
  <div class="footer"><?php include('./site_content/footer.html');?></div>
</div>
</body>
</html>

Upvotes: 4

hakre
hakre

Reputation: 198209

HTML itself - ignoring framesets and iframes which do have an effect on SEO and are generally not really recommended - does not have any method to include partial HTML.

You can however use PHP (or SSI if you're oldskool) for such. It has a command to include partial files, it's called include PHP Manual.

PHP needs to be activated on your server for it. To keep this transparent you might want to map the .html file extension to PHP or use Mod_Rewrite to do that. That depends on the type of server and it's configuration.

Might it slow down the site?

The server has more work to do to process the request, therefore it slows down the site a little bit. But normally for a simple site you won't notice that much.

To prevent such, it's possible to build a simple caching mechanism on top that will convert the dynamic PHP output into static files on the fly.

Upvotes: 1

Related Questions