Question

我正在修改Yeoman＆＃34; webapp＆＃34;构建和定制它以满足我的需求。

我想在网站上做一些简单的重复模式，比如页眉和页脚。我跟Jekyll谈了一下，但我担心它对我的需求有点过于复杂。

我目前正在使用PHP，但这并不适合Grunt。

是否有一个简单的替代PHP包含或使用Grunt运行PHP的方法？什么是最佳做法？

Answer 1

如果你真的与杰基尔混淆，只需花一个小时浏览网站，你就会获得超级大国。对于模板而言，这是简单的html +逻辑的一点点液体，仅此而已。

我真的觉得它比所有的Yeoman，Grunt更简单。

我的两分钱。

Answer 2

我既不认识Yeoman也不认识Grunt，但是像David Jacquel在他的回答中已经说过：用Jekyll制作全局页眉和页脚简单。

您需要布局文件，这只是一个带有占位符的HTML文件，该文件位于/_layouts文件夹（请参阅Directory structure）：

我将其称为default.html，因此完整路径为：/_layouts/default.html

<!DOCTYPE html>
<html>
<head>
    <title>{{ page.title }}</title>
</head>
<body>

    <div>
    YOUR HEADER HERE
    </div>

    <div>
    {{ content }}
    </div>

    <div>
    YOUR FOOTER HERE
    </div>

</body>
</html>

{{ content }}是插入实际网页内容的地方。
{{ page.title }}指的是页面的标题（需要在每个页面中定义）。

然后，您需要创建一个实际页面。您可以使用HTML或Markdown：

`/index.html`：

---
layout: default
title: page title here
---

Some <strong>text</strong>

...或`/index.md`：

---
layout: default
title: page title here
---

Some **text**

开头的---部分为YAML Front-matter。
行layout: default指的是之前创建的/_layouts/default.html文件。
title: ...行将插入布局文件中的{{ page.title }}占位符。

最终结果，无论您使用HTML还是Markdown，都会创建为/index.html，如下所示：

<!DOCTYPE html>
<html>
<head>
    <title>page title here</title>
</head>
<body>

    <div>
    YOUR HEADER HERE
    </div>

    <div>
    Some <strong>text</strong>
    </div>

    <div>
    YOUR FOOTER HERE
    </div>

</body>
</html>

如果您想使布局更加模块化，您还可以将自定义页眉和页脚移动到单独的include files。
将布局文件更改为：

<!DOCTYPE html>
<html>
<head>
    <title>{{ page.title }}</title>
</head>
<body>

    {% include header.html %}

    <div>
    {{ content }}
    </div>

    {% include footer.html %}

</body>
</html>

两个{% include ...行引用/_includes文件夹中的文件，因此您可以创建/_includes/header.html和/_includes/footer.html并将所需的HTML放入这些文件中。

简单的PHP包括Grunt（或替代）

2 个答案:

`/index.html`：

...或`/index.md`：

简单的PHP包括Grunt（或替代）

2 个答案:

/index.html：

...或/index.md：

`/index.html`：

...或`/index.md`：