如何在 Jekyll GitHub 页面上按页面分隔帖子？

Question

我刚开始使用 GitHub 个页面，我有一个问题。

创建 'Categories' 个页面后，我想添加一些类别的帖子（不是所有帖子！）。但是如果我设置为

---
title: "Project"
permalink: /project/
layout: categories
---

然后他们会显示所有帖子。但我只想显示一些帖子（我不确定，但也许是 'Project' 页下的一些帖子？）。

很抱歉，即使我不知道怎么问这个问题，但如果你知道这个，有人可以帮我解决这个问题吗...？

Answer 1

在您博客的首页（三虚线之间），您可以设置预定义变量或创建自定义变量。

预定义变量 date、category/categories 和 tags 开箱即用，可用于 post.

首先，对于每个要标记和分类的 post，您的封面应该如下所示。

示例，

---
layout: post
title:  Building a CRUD API using Node.js
tags: [ API , Node.js , Javascript ]
categories: [Software Development, Long Posts]
---

---
layout: post
title:  My dog bruno
tags: [ Pets , Dogs , Fun ]
categories: [ Lifestyle , Short Posts ]
---

现在，创建一个 tag.html 和一个 categories.html 文件。

如果您在根目录中创建它们，您将能够访问通过 your_site_url/tags 或 your_site_url/categories

的页面

例如

http://localhost:4000/tags
http://localhost:4000/categories

如果您在文件夹 pages 中创建它们，则通过 url/pages/tags 或 url/pages/categories

例如

http://localhost:4000/pages/tags
http://localhost:4000/pages/categories

根据https://jekyllrb.com/docs/variables/ site.tags.TAG 将给出所有的列表带有标签 TAG 的帖子。同样 site.categories.CATEGORY 将给出所有帖子的列表类别 CATEGORY.

它以 [tag,post] 或 [category,post] 的格式存在。如果您遍历 site.tags 或 site.categories 使用

   {% for tag in site.tags %}
       tag[0] -> Will be the tag value.
       tag[1] -> Will be the entire post.
   {% endfor %}

   {% for tag in site.categories %}
       tag[0] -> Will be the category value.
       tag[1] -> Will be the entire post.
   {% endfor %}

现在使用来自 https://github.com/codinfox/codinfox-lanyon/tree/dev/blog/

的这些片段

在 tags.html 中添加以下代码段

---
layout: page
title: Tags
---

<div class="tags-expo">
  
  <div class="tags-expo-list">
    {% for tag in site.tags %}
    <a href="#{{ tag[0] | slugify }}">
      <div class="tag">{{ tag[0] }}</div>  
    </a>
    {% endfor %}
  </div>
  
  <hr />

  <div class="tags-expo-section">
    {% for tag in site.tags %}
    <h2 id="{{ tag[0] | slugify }}">{{ tag[0] }}</h2>
    <ul class="tags-expo-posts">
      {% for post in tag[1] %}
      <a class="ay-list" href="{{ site.baseurl }}{{ post.url }}">
        <li>
          {{ post.title }}
          <!-- Add the below line if you want the date to be displayed -->
          <small class="post-date">{{ post.date | date_to_string }}</small> 
        </li>
      </a>
      {% endfor %}
    </ul>
    {% endfor %}
  </div>

</div>

在 categories.html 中添加以下代码段 site.categories 而不是 site.tags。

---
layout: page
title: Categories
---

<div class="tags-expo">
  <div class="tags-expo-list">
    {% for tag in site.categories %}
    <a href="#{{ tag[0] | slugify }}"> <div class="tag">{{ tag[0] }}</div></a>
    {% endfor %}
  </div>
  <hr />
  <div class="tags-expo-section">
    {% for tag in site.categories %}
    <h2 id="{{ tag[0] | slugify }}">{{ tag[0] }}</h2>
    <ul class="tags-expo-posts">
      {% for post in tag[1] %}
      <a class="post-title" href="{{ site.baseurl }}{{ post.url }}">
        <li>
          {{ post.title }}
          <!-- Add the below line if you want the date to be displayed -->
          <small class="post-date">{{ post.date | date_to_string }}</small> 
        </li>
      </a>
      {% endfor %}
    </ul>
    {% endfor %}
  </div>
</div>

slugify用于将字符串转换为小写URL“slug”。

这应该会为您提供两个带有标签和类别的单独页面，其中 post 根据给定的 tag/category.

显示

这些片段来自 https://github.com/codinfox/codinfox-lanyon，因此您需要参考 CSS 或使用您的自定义 CSS。

如何在 Jekyll GitHub 页面上按页面分隔帖子？

How to separate posts by pages on Jekyll GitHub Pages?

blogs

github

jekyll