修改现有的 Jekyll 主题以拥有静态主页答案

【问题标题】：Modifying an existing Jekyll theme to have static homepage修改现有的 Jekyll 主题以拥有静态主页
【发布时间】：2020-05-18 14:33:37
【问题描述】：

我正在使用这个主题制作一个网站：Github repo; theme demo.

主题是使用主页上的博客提要 (index.html) 构建的。我想做的是：

制作一个静态主页（即主页上没有博客提要），和
在名为“Blog”的单独页面上发布博客供稿，并带有“/blog”或“/blog.html”链接。

博客提要的代码位于_includes/blog.html 中，并使用{% include blog.html %} 包含在home 布局中。

我的尝试

将index.html的布局更改为page这样的静态布局，并在根目录下创建了一个名为blog.html的新页面，布局为home——这成功创建了一个静态主页，但是博客页面生成类似主页的标题，但没有博客提要（本质上是一个没有内容的页面）。
在名为blog.html 的根中创建了一个新页面，其布局为default，并将主页布局的内容（包括{% include blog.html %}）粘贴到该页面中 - 这产生了与上述相同的结果。
创建了一个名为blog 的新布局，它是当前home 布局的副本。我从home 布局中删除了{% include blog.html %} 行。然后我给index.html home 布局并在根目录中创建了一个名为blog.html 的新页面，布局为blog。这产生了与上述相同的结果。

简而言之，除了index.html 之外，似乎无法在任何文件中生成博客提要，我也无法弄清楚原因。这是我在主题配置中缺少的东西吗？如果这是一个愚蠢的问题，我深表歉意——我对此很陌生。感谢您能给我的任何帮助！

编辑：原来这是分页器的问题，默认情况下从家分页。

【问题讨论】：

您是如何解决分页器问题的？
@iatharva，分页逻辑仅适用于index.html 文件。如果您想像我一样在非主页上使用分页器生成博客提要，您应该在根目录中创建另一个目录并在该目录中创建一个新的index.html 文件。例如：我在根目录中创建了一个blog 目录，并在其中创建了index.html，我将所有的分页/博客提要代码放在这里。这会在 baseurl/blog 生成一个博客提要
我已经在_includes 文件夹中添加了blog.html，但仍然无法正常工作。您能否详细说明在根目录中创建目录是什么意思？
你能详细解释一下吗？或者只是通过告诉你如何解决它来添加这个帖子的答案@olvoku

标签： jekyll github-pages static-site jekyll-theme

【解决方案1】：

index.html 使用主布局：

---
layout: home
---

这位于_layouts/home.html 中，包含一个标头和blog.html。它看起来像这样：

---
layout: default
---

<div class="home">

    <div id="main" class="call-out"
         style="background-image: url('{{ site.header_feature_image | relative_url }}')">
        <h1> {{ site.header_text | default: "Change <code>header_text</code> in <code>_config.yml</code>"}} </h1>
    </div>

    {% include blog.html %}

</div>

blog.html 文件遍历所有（博客）帖子：

<div class="posts">
    {% for post in paginator.posts %}
...

要解决您的问题，您需要将自己的主页定义为这样的包含：

使用您选择的 html 创建 your-custom-homepage.html。
将其包含在home.html 中作为{% include your-custom-homepage.html %} 而不是{% include blog.html %}。只需替换 _layouts/home.html 中的行。

然后它将包含标题和您的内容。

Jekyll 文档，例如https://jekyllrb.com/docs/step-by-step/04-layouts/ 和 https://jekyllrb.com/docs/includes/ 希望能解释一下细节。

【讨论】：