Question

我在 GitHub页面上托管了一个静态网站，该网站的规模正在增长。通常我会使用服务器端包含（<?php include('path to file'); ?>）来引入页眉，页脚和任何导航文件。但是php不能在GitHub Pages上运行。

HTML5嵌入是否采用了一种iFrame技术，这是我唯一的选择？

我见过this，this，this，this等帖子，但它们似乎不适用于GitHub页面。

不太理想。

感谢。

Answer 1

Jekyll是一种常见的解决方案。它是一个静态网站生成器，允许您使用Liquid templates，并且made to run on GitHub's servers。

{% include %}功能的一个很好的示例可以在Twitter Bootstrap的文档页面上看到，它们使用header.html和footer.html的包含：

enter image description here

Answer 2

使用模板并在构建时预处理它们（而不是运行时）。你可以将它们设置为构建为git commit hook。

有很多工具可以执行此操作listed here，我很喜欢ttree。

Answer 3

我知道这是一个迟到的答案，但这是我最近偶然发现的事情事实证明，http://w3schools.com/以上的人创建了一些简单的JavaScript代码作为SSI的替代品：

<!DOCTYPE html>
<html>
<script>
function w3IncludeHTML() {
  var z, i, a, file, xhttp;
  z = document.getElementsByTagName("*");
  for (i = 0; i < z.length; i++) {
    if (z[i].getAttribute("w3-include-html")) {
      a = z[i].cloneNode(false);
      file = z[i].getAttribute("w3-include-html");
      var xhttp = new XMLHttpRequest();
      xhttp.onreadystatechange = function() {
        if (xhttp.readyState == 4 && xhttp.status == 200) {
          a.removeAttribute("w3-include-html");
          a.innerHTML = xhttp.responseText;

          z[i].parentNode.replaceChild(a, z[i]);
          w3IncludeHTML();
        }
      }      
      xhttp.open("GET", file, true);
      xhttp.send();
      return;
    }
  }
}
</script>
<body>
<div w3-include-html="content.html"></div>
<script>
w3IncludeHTML();
</script>
</body>
</html>

Here's一个例子。

Answer 4

我制作了一个关于如何使用AJAX导入自定义HTML模板的视频。它将在导入的HTML中运行脚本标记而不使用eval（），并且用于进行导入调用的脚本标记将使用导入的代码替换自身，因此div中没有嵌套。它基本上是一个非常干净的AJAX站点构建器。这是链接：https://www.youtube.com/watch?v=ZqD61tIoG2s&t=18s&index=1&list=PLRJ8uW8FBcZJMiFbPNG67lsFHhFF1k322

源代码可以在视频说明中找到。

Answer 5

应该支持SSI！

<!--#include virtual="layout.html" -->

包含以上行的文件必须以“ .shtml”或“ .shtm”扩展名结尾！

Answer 6

jQuery load（）为此很好。

服务器端包括替代方案

6 个答案: