Website menu - best method

dahayeser

Hello,

I am looking for advice on how best to code a main menu on a website.

Option 1

---

Cut and paste the HTML on to eache page in the website. The obvious disadvantage here is that if you need to change the menu you need to change each page in the website.

Option 2

---

Include a the menu in a JavaScript file and use the JavaScript document.write function to write the menu to the page. The main disadvantage with this approach to my knowledge is that the menu doesn't exist the page is loaded so it is very bad from an SEO point of view.

Option 3

---

Include a the menu in a PHP file and echo the menu to the page. I don't really know of any disadvantage with this approach except is can look a bit messy - e.g. the menu may contain mouse over functions and you are putting everything into an echo statment and escaping quotation marks etc..


Option 4

---

Include a menu in a .phtml file. I would be interested in getting peoples opinion on this approach. I have only come across it recently and I don't see any disadvantage myself. It seems very clean - you are just including including a file that just has html in it. It is easy to edit in dreamweaver or any editor because the html embedded in JavaScript or PHP.

Any opinions on the above would be welcome.

Also is the recommended way - by web 2.0 standards? and what methods do you guys use?

Cheers,
Sean

Bob_Harris

I don't know what a .phtml extention is, something to do with perl maybe.

Use the include() function to open up the file and include it's contents in the current file.

nav.htm (or php or whatever)
[html]
<ul id="navigation">
<li><a href=".">1</a></li>
<li><a href="2">2</a></li>
<li><a href="3">3</a></li>
<li><a href="4">4</a></li>
</ul>
[/html]

page.php
[php]
<?php include_once('nav.htm'); ?>
[/php]

If you want to be able to pinpoint and style the link to the currently displayed page, you could do something like this:

nav.php
[php]
<?php
//get name of current page
$page = strrchr($_SERVER,"/");
?>
<ul id="navigation">
<li><a href="one.php" <?php echo ($page == '/one.php') ? "id='current_link'" : "" ?> >Page One</a></li>
<li><a href="two.php" <?php echo ($page == '/two.php') ? "id='current_link'" : "" ?> >Page Two</a></li>
<li><a href="three.php" <?php echo ($page == '/three.php') ? "id='current_link'" : "" ?> >Page Three</a></li>
<li><a href="four.php" <?php echo ($page == '/four.php') ? "id='current_link'" : "" ?> >Page Four</a></li>
</ul>
[/php]

If you have nav.php included in two.php and two.php is executed, $_SERVER will return /xxx/xxx/two.php. Using strrchr we search for the last instance of "/" and chop the string there. In your style sheet you can style #current_link.



This is basically a short hand IF statement.
[php]
<?php echo ($page == '/one.php') ? "id='current_link'" : "" ?>
[/php]
Could be reproduced like this:
[php]
if($page == '/one.php'){
echo "id='current_link'";
}
else{
echo "";
}
[/php]