在多个页面上有一个菜单？答案

【问题标题】：Have a single menu on multiple pages?在多个页面上有一个菜单？
【发布时间】：2011-01-14 01:16:18
【问题描述】：

所以我有一个网站，我正在使用位于屏幕右上角的基本菜单。其链接如下：

| Home | Blog | Results | Pictures | Our Location |

有时我需要向菜单添加新链接或更改其中一个链接指向的位置。这意味着在菜单存在的每个页面上，我都必须手动更改链接。当然，有一些方法可以让主菜单放在每一页上。

还是我在做梦？

【问题讨论】：

标签： html menu

【解决方案1】：

将菜单放在一个单独的文件中并将其包含在服务器端，可以使用 PHP 等成熟的脚本语言（一行）或使用 SSI。

【讨论】：

我不懂php。您能否提供一个如何使用 SSI 的示例？
链接文章 (<!--#include virtual="path/to/menu.htm" -->) 中有一个 SSI 示例，在 PHP 中为：<?php include 'path/to/menu.htm'; ?>。
S.：所以我刚刚发现 Yahoo Small Business 不支持 .shtml。还有其他选择吗？
我使用了 PHP 包含。我想学习永远都不晚。 ;-)

【解决方案2】：

有多种方法可以做到这一点。这取决于您在服务器上可以访问的内容。可能最简单的机制是server-side includes。您只需要一个包含菜单的文件并将其包含在每个页面上。

您也可以以或多或少优雅的方式对每种编程语言执行此操作。

编辑：SSI 非常简单。您可以只创建一个 /header.html 文件，然后执行：

 <!--#include virtual="/header.html" -->

在适当的地方。

【讨论】：

【解决方案3】：

在所有页面上使用 PHP 包含

<?php include 'includes/menu.php'; ?>

并在名为“includes”的文件夹中有一个单独的 menu.php。您需要将所有 oyur 页面保存为 .php

您也可以将页脚设为包含

【讨论】：

【解决方案4】：

我认为这是无需服务器端语言的最简单方法。使用像 W3Data 这样的 JavaScript 库。您需要做的就是将 w3-include-html 属性添加到您的 div 中。完成！

如果你的菜单在一个名为 menu.html 的文件中，你会做这样的事情。

<div w3-include-html="menu.html"></div>

【讨论】：

【解决方案5】：

让服务器端程序确定哪些菜单和链接的位置需要在那里。然后使用ajax定期轮询服务器端脚本，获取当前时间的菜单内容。

很容易让它发回一个 xml 数据，例如：

<menu>
    <link name="Home" href="destinationhome.html"/>
...
    <link name="Pictures" href="....html"/>
 </menu>

然后根据这些数据构建您的链接。

【讨论】：

【解决方案6】：

您可以在上传模板之前从模板生成页面：请参阅Template Toolkit。

【讨论】：