tag page about neilchenxie.github.io

[neilChenXie]

page

• Reference

cd /path/to/my-jekyll-project/
touch tags.html

---
layout: page
permalink: /tags/
---

<ul class="tag-cloud">
{% for tag in site.tags %}
  <li style="font-size: {{ tag | last | size | times: 100 | divided_by: site.tags.size | plus: 70  }}%">
    <a href="#{{ tag | first | slugize }}">
      {{ tag | first }}
    </a>
  </li>
{% endfor %}
</ul>

<div id="archives">
{% for tag in site.tags %}
  <div class="archive-group">
    {% capture tag_name %}{{ tag | first }}{% endcapture %}
    <h3 id="#{{ tag_name | slugize }}">{{ tag_name }}</h3>
    <a name="{{ tag_name | slugize }}"></a>
    {% for post in site.tags[tag_name] %}
    <article class="archive-item">
      <h4><a href="{{ site.baseurl }}{{ post.url }}">{{post.title}}</a></h4>
    </article>
    {% endfor %}
  </div>
{% endfor %}
</div>

[neilChenXie]

Tag Cloud

<h1>Tag Cloud</h1>
{% assign tags = site.tags | sort %}
{% for tag in tags %}
 <span class="site-tag">
    <a href="/tag/{{ tag | first | slugify }}/"
        style="font-size: {{ tag | last | size  |  times: 4 | plus: 80  }}%">
            {{ tag[0] | replace:'-', ' ' }} ({{ tag | last | size }})
    </a>
</span>
{% endfor %}

[neilChenXie]

Collections

site.tags is used for display all tags, but generating tag pages is based on jekyll collections.

• Reference

_config.yml

collections:
  tags_page:
      output: true  # create static pages
      permalink: /tag/:slug/
defaults:
    - scope:
        path: ""
        type: tags_page #decided {collection} folder
      values:
        layout: page_tag # decided which layout will be used

_{collection} folder

_ is very important for jekyll to recognize it.

layouts

[neilChenXie]

Relation

1. collection
2. tag cloud

[neilChenXie]

总结： http://chen-node.com/communication/jekll_tag_page/