# 原创
: 为Jekyll博客添加小功能
# 为Jekyll博客添加小功能
# 为博客添加各种功能
## 1.关于Jekyll本身插件的安装
一共三种方式:
* 在根目录下新建`_plugins`文件夹, 然后把对应的`*.rb`插件文件放进去就行了;
* 在`_config.yml`文件中增加一个`gems`关键字, 然后把要引用的插件用数组形式存储其中即可;
* 在Gemfile中添加相关的插件;
三种方法都可以, 甚至完全可以同时使用~
## 2.用kramdown自动生成目录树
```
* 目录
{:toc}
```
第一行必须加!
## 3.添加标签归档页
```
---
layout: post
title: 标签
permalink: /tags/
---
<ul class="tags">
{% for tag in site.tags %}
<li>
<a href="#{{ tag[0] }}">{{ tag[0] }}</a> <sup>{{ tag[1].size }}</sup>
</li>
{% endfor %}
</ul>
<ul class="listing">
{% for tag in site.tags %}
<li class="listing-seperator" id="{{ tag[0] }}">{{ tag[0] }}</li>
{% for post in tag[1] %}
<li class="listing-item">
<time datetime="{{ post.date | date:"%Y-%m-%d" }}">{{ post.date | date:"%Y-%m-%d" }}</time>
<a href="{{ post.url }}" title="{{ post.title }}">{{ post.title }}</a>
</li>
{% endfor %}
{% endfor %}
</ul>
```
## 4.添加日期归档页
```
---
layout: post
permalink: /archives/
title: "归档"
---
<ul>
{% for post in site.posts %}
{% unless post.next %}
<h2>{{ post.date | date: '%Y年' }}</h2>
{% else %}
{% capture year %}{{ post.date | date: '%Y' }}{% endcapture %}
{% capture nyear %}{{ post.next.date | date: '%Y' }}{% endcapture %}
{% if year != nyear %}
<h2>{{ post.date | date: '%Y年' }}</h2>
{% endif %}
{% endunless %}
<li>{{ post.date | date:"%Y年%m月%d日:" }} <a href="{{ post.url }}">{{ post.title }}</a></li>
{% endfor %}
</ul>
```
## 5.添加网易云音乐插件
```
<!-- cloud music -->
<!-- auto=1 可以控制自动播放与否,当值为 1 即打开网页就自动播放,值为 0 时需要访客手动点击播放 -->
<iframe frameborder="no" border="0" marginwidth="0" marginheight="0" width=330 height=86
src="//music.163.com/outchain/player?type=2&id={{ page.music-id }}&auto=0&height=66">
</iframe>
```
```
<!-- 在正文开头添加网易云音乐插件 -->
{% if page.music-id %}
{% include cloud-music.html %}
{% endif %}
{{ content }}
```
## 6.添加站点访客数及文章浏览量
```
<script async src="//dn-lbstatics.qbox.me/busuanzi/2.3/busuanzi.pure.mini.js">
</script>
```
```
<!-- pv的方式,单个用户连续点击n篇文章,记录n次访问量 -->
<span id="busuanzi_container_site_pv">
本站总访问量<span id="busuanzi_value_site_pv"></span>次
</span>
```
```
<!-- uv的方式,单个用户连续点击n篇文章,只记录1次访客数 -->
<span id="busuanzi_container_site_uv">
本站访客数<span id="busuanzi_value_site_uv"></span>人次
</span>
```
1. 显示单页面访问量
```
<!-- pv的方式,单个用户点击1篇文章,本篇文章记录1次阅读量 -->
<span id="busuanzi_container_page_pv">
本文总阅读量<span id="busuanzi_value_page_pv"></span>次
</span>
```
## 7.添加中英文字数统计