Giter Club home page Giter Club logo

category1's Introduction

Jekyll add category list in archives

11 Mar 2014

Archives 页面显示是所有文章的列表, 想把每个分类目录的文章列表也专门显示出来。

首先需要在文章的 Meta 信息里指定目录:

category: "测试分类目录" 然后这个分类目录名就是"测试分类目录"。

然后在archives模板增加:

(把里面的反斜线都去掉,这里为了防止被解析,不知道如果禁止文章里的模板语句被解析,囧!)

{% for category in site.categories %}

  • {\{ category | first }}
      {\% for posts in category %} {\% for post in posts %} {\% if post.url %}
    • {\{ post.title }}
    • {\% endif %} {\% endfor %} {\% endfor %}
  • {\% endfor %} 这里加了 if 语句判断是因为我本地测试发现文章列表 posts 里的第一篇是 category目录名, 所以没有url,在页面上显示是空白的一行,把这行筛选掉就可以了。

    参考了Jekyll文档:

    Variables Templates

    category1's People

    Contributors

    qijiang60 avatar

    Watchers

    James Cloos avatar

    Recommend Projects

    • React photo React

      A declarative, efficient, and flexible JavaScript library for building user interfaces.

    • Vue.js photo Vue.js

      🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

    • Typescript photo Typescript

      TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

    • TensorFlow photo TensorFlow

      An Open Source Machine Learning Framework for Everyone

    • Django photo Django

      The Web framework for perfectionists with deadlines.

    • D3 photo D3

      Bring data to life with SVG, Canvas and HTML. 📊📈🎉

    Recommend Topics

    • javascript

      JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

    • web

      Some thing interesting about web. New door for the world.

    • server

      A server is a program made to process requests and deliver data to clients.

    • Machine learning

      Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

    • Game

      Some thing interesting about game, make everyone happy.

    Recommend Org

    • Facebook photo Facebook

      We are working to build community through open source technology. NB: members must have two-factor auth.

    • Microsoft photo Microsoft

      Open source projects and samples from Microsoft.

    • Google photo Google

      Google ❤️ Open Source for everyone.

    • D3 photo D3

      Data-Driven Documents codes.