在Jekyll驱动的站点上创建类别

I'm having a hard time understanding how to generate archive pages for each category I use on my blog. I'd like the user to be able to click on a category and then be taken to a page that lists out all articles with the desired category assigned.

我很难理解如何为我在博客上使用的每个类别生成归档页面。我希望用户能够点击一个类别，然后被带到一个页面，该页面列出了所有指定类别的文章。

The only way I can think of doing it is by manually creating a specific html file for each category in the root. But I'm sure there must be a more dynamic way?

我能想到的唯一方法是为根目录中的每个类别手工创建一个特定的html文件。但我确定一定有更动态的方法?

I have the site hosted on github - https://github.com/sirbrad/sirbrad.github.com

我的网站托管在github上——https://github.com/sirbrad/sirbrad.github.com

Thanks in advance!

提前谢谢!

Brad

布莱德

4 个解决方案

#1

You can generate a list of all the available categories by using the site.categories data, using the first element of each category (which is an array) to get the category name:

您可以使用该站点生成所有可用类别的列表。类别数据，使用每个类别的第一个元素(即数组)获取类别名称:

{% for cat in site.categories %}
    <li>{{ cat[0] }}</li>
{% endfor %}

And you can generate a list of all the posts in a given category like so:

你可以生成一个给定类别的所有文章的列表，比如:

{% for post in site.categories.CATEGORY_NAME %}

It doesn't seem possible to generate an individual HTML page for each category as you were hoping, but perhaps a good compromise would be to generate a single page containing a list of all categories, where each category contains all the posts in that category. You could then use some simple JavaScript to hide the posts in each category until the category name is selected, giving almost the same user experience as individual archive pages for each category.

似乎不可能像您希望的那样为每个类别生成一个单独的HTML页面，但可能一个很好的折衷办法是生成一个包含所有类别列表的页面，其中每个类别包含该类别的所有文章。然后，您可以使用一些简单的JavaScript来隐藏每个类别中的文章，直到选择了类别名称，为每个类别提供几乎与单个归档页面相同的用户体验。

#2

Note: I'm linking examples here that are using tags (because the examples already existed, with tags), but they work the same for categories.

注意:我在这里链接使用标记的示例(因为示例已经存在，使用标记)，但是它们对类别的作用是相同的。

---

If you don't want to use a plugin, for example if you want your site to work on GitHub Pages, you have only two options:

如果你不想使用插件，比如你想让你的网站在GitHub上运行，你只有两个选择:

1. Create a single page which contains all categories, alphabetically sorted

   创建一个包含所有类别的页面，按字母顺序排序

2. Indeed create a separate HTML file for each category manually, but put as much as possible into a layout file, so creating a new category page isn't much work:

   的确，手工为每个类别创建一个单独的HTML文件，但在布局文件中放置尽可能多的HTML文件，因此创建一个新的类别页面并不是什么大工程:

   /_layouts/tagpage.html:

   ---
   layout: default
   ---
   
   <h1>{{ page.tag }}</h1>
   
   <ul>
   {% for post in site.tags[page.tag] %}
     <li>
       {{ post.date | date: "%B %d, %Y" }}: <a href="{{ post.url }}">{{ post.title }}</a>
     </li>
   {% endfor %}
   </ul>
   

   With this layout file, you need only two lines of YAML front-matter to add a new tag page:
   (in this case for the jekyll tag)

   对于这个布局文件，您只需要两行YAML前端内容就可以添加一个新的标记页面:(在这个例子中是jekyll标记)

   /tags/jekyll/index.html:

   ---
   layout: tagpage
   tag: jekyll
   ---
   

   So the actual effort to create a new tag page is minimal - the only thing is that you need to remember to do it when you're using a new tag for the first time.

   因此，创建新标记页面的实际工作是最少的——惟一的事情是，当您第一次使用新标记时，您需要记住这一点。

#3

You can use Dave Perett's generate_categories.rb plugin to automatically create a page for each category in your site. Then, use a for loop to run through your site categories and create a link for each in your navigation (or wherever you want to link to the archive pages), as Jon did in his answer to your quesiton.

您可以使用Dave Perett的generate_categories。rb插件可以自动为您的站点中的每个类别创建一个页面。然后，使用for循环遍历站点类别，并为导航(或您希望链接到归档页面的任何地方)中的每个类别创建链接，就像Jon在回答您的问题时所做的那样。

#4

For github pages, you can make an archive page with

对于github页面，您可以使用它创建一个存档页面

{% for pt in site.categories %}[{{pt[0]}}](#cat-{{pt[0]}}), {% endfor %}

{% for cat in site.categories %}
{% assign nt = cat[0] %}

#### {{ nt }} {#cat-{{nt}}}
<ul> 
  {% for post in site.posts %}
     {% for pt in post.categories %}
    {% if nt == pt %}
      <li>
        {{post.published}} <a href="{{ post.url }}">{{ post.title }}</a>
      </li>
    {% endif %}  
   {% endfor %} 
  {% endfor %}
</ul>  
{% endfor %}

On my machine, with about 200 posts it takes 3s to generate the whole site. This is because the inner if is executed categories x number_of_posts times. On the other hand, you will have an archive page without using any plugin.

在我的机器上，大约有200篇文章需要3s生成整个站点。这是因为执行类别x number_of_posts的内部if次数。另一方面，您将拥有一个归档页面而不使用任何插件。