Tag: Footer

Website Design 101: Common Navigation & Include Statements

Website Design 101: Common Navigation & Include Statements
If you’re designing a site from scratch, and not using a Content Management System (CMS) such as Joomla!, Drupal or DotNetNuke, but using PHP or ASP (.net) it’s a good idea to incorporate key common elements of your site in an external file. For example, let’s say you have a 20 page website, and a common design element in all your pages is a simple navigation drop down menu. You wouldn’t want to repeat this menu code on all your pages, as it would create messy code, and would be extremely difficult to update. What you’ll want to do is place the code for the menu in an external file, such as “menu.php”, and call the file from your pages using the include command in PHP. An example would be:

<?php include “include_menu.php” ?>

You could also include other common elements, such as footer elements and navigation (which you can also drop in your Google Analytics code into) and certain meta tags (Keywords, Description). So the final product would have several include statements which would reference these external files. I’ll include a basic example of a template, with a really basic menu.
Here would be the source code for any of your main pages:

<pre>
<html>
<head>
<title>Sample Page</title>
<?php include “meta.php”>
</head>

<body>
<div id=”Menu”><?php include “menu.php”></div>
<div id=”Content”>This is a sample Page</div>
<?php include “footer.php”>
<div id=”Footer”><?php include “footer.php”></div>
</body>

</html>
</pre>

And your menu.php page would have the following:

<a href=”link1.html”>Sample Link 1</a> <a href=”link2.html”>Sample Link 2</a> <a href=”link3.html”>Sample Link 3</a>

Leave a Comment :, , , , , , , , , , more...