一共三步，很简单。跟着走就可以。

Step 1 . 增加 category_list 插件

在 octopress\plugins\ 文件夹里面，新建一个文件，取名为：category_list_tag.rb。并将下面的代码粘贴到里面。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

module Jekyll
  class CategoryListTag < Liquid::Tag
    def render(context)
      html = ""
      categories = context.registers[:site].categories.keys
      categories.sort.each do |category|
        posts_in_category = context.registers[:site].categories[category].size
        category_dir = context.registers[:site].config['category_dir']
        category_url = File.join(category_dir, category.gsub(/_|\P{Word}/, '-').gsub(/-{2,}/, '-').downcase)
        html << "<li class='category'><a href='/#{category_url}/'>#{category} (#{posts_in_category})</a></li>\n"
      end
      html
    end
  end
end

Liquid::Template.register_tag('category_list', Jekyll::CategoryListTag)

这个插件会向liquid注册一个名为category_list的tag，该tag就是以li的形式将站点所有的category组织起来。如果要将category加入到侧边导航栏，需要增加一个aside。

Step 2 . 增加 aside

在 octopress\source\_includes\asides\ 文件夹里面，新建一个文件，取名为：category_list.html 。并粘贴下面的代码：

注意： 去掉 % 前面的 \。

1
2
3
4
5
6

<section>
  <h1>Categories</h1>
  <ul id="categories">
      {\% category_list \%}
  </ul>
</section>

Step 3 . 在 _config.yml 文件里面 ，修改 default_asides 项

打开 octopress\_config.yml 文件，修改里面的 default_asides 项，将 asides/category_list.html 添加进去。

1

default_asides: [asides/category_list.html, ......]

搞定

现在，我们执行 rake generate 命令来生成最新的博客站点。然后执行 rake preview 命令在本地预览博客站点。 看看修改后的效果。

参考网站：

为octopress添加分类(category)列表 http://codemacro.com/2012/07/18/add-category-list-to-octopress/

• 我的电脑系统：Windows 10 64位
• SQL Server 软件版本： SQL Server 2014 Express

之前，我们介绍了如何使用图形化操作建表和主外键约束。这一节我们来介绍如何使用命令来建表和主外键约束。

使用命令 建表

Step 0 . 先把之前在这篇博客里面建的表删除，我们先使用命令重新建。（如果你没有看这篇博客，就不需要做这一步的操作了。）

Step 1 . 先选中（要建表的）库，然后点击 新建查询，输入下面的命令：（先建部门（dept）表，再建员工（emp）表）

1
2
3
4
5
6

create table dept
(
  dept_id int primary key,
  dept_name nvarchar(100) not null,
  dept_address nvarchar(100)
)

Step 2 . 现在点击 对号 图标（分析），看看有没有语法错误。然后点击 执行(X) 按钮，来生成表。现在在做出的 表 里面右键 ，选择 刷新 。现在你就看到了，创建了一个新的表 dept 。

解释：--后面跟注释信息。SQL 定义变量和 C++ 定义变量是反着的。

Step 3 .

1
2
3
4
5
6
7

create table emp
( --不能写成{} ，C++才写成}
  emp_id int constraint pk_emp_id_haha primary key,
  emp_name nvarchar(20) not null,
  emp_sex nchar(1),
  dept_id int constraint fk_dept_id_heihei foreign key references dept(dept_id)
)

解释： 1. 对于约束（constraint），要写一个名字（pk_emp_id_haha 和 fk_dept_id_heihei 都是自定义的名字），如果你不写名字，系统会自动给它分配一个名字。 2. primary key 是主键； foreign key 是外键。 3. create table 最后一个字段的后面建议不要写 , （逗号）。

选中这些命令。点击 执行 按钮。并刷新 表，emp 表就会出现。

PK 指的是 主键 ；FK 指的是 外键。

下面的是我们刚刚定义的 emp 表的主键和外键的名字：

下面的是我们没有给取名字的 dept 表的主键的默认名字：

总结：

使用命令 create table 来建表。

Q： 什么是约束？ A： 主键约束 和 外键约束 的作用：

• 定义
  • 对一个表中的属性操作的限制叫做约束。
• 分类
  • 主键约束
    • 不允许重复元素 避免了数据的冗余。
  • 外键约束
    • 通过外键约束从语法上保证了本事物所关联的其他事物一定是存在的。（就是说：事物与事物之前的关系是通过外键来体现的）

你要是感觉命令很难，就多敲，敲一敲就好了。

下载

首先到 https://github.com/robbyedwards/octopress-tag-pages 和 https://github.com/robbyedwards/octopress-tag-cloud clone这两个项目的代码。

```
$ git clone https://github.com/robbyedwards/octopress-tag-cloud.git
$ git clone https://github.com/robbyedwards/octopress-tag-cloud.git
```

octopress-tag-pages

Step 1 . 将 octopress-tag-pages\plugins 路径里面的 tag_generator.rb 文件复制到 octopress\plugins\ 文件夹里面。

Step 2 . 将 octopress-tag-pages\source\_includes\custom 路径里面的 tag_feed.xml 文件复制到 octopress\source\_includes\custom\ 文件夹。

Step 3 . 将 octopress-tag-pages\source\_layouts 路径里面的 tag_index.html 文件复制到 octopress\source\_layouts\ 文件夹里。

octopress-tag-cloud

Step 1 . 将 octopress-tag-cloud\plugins 路径里面的 tag_cloud.rb 文件复制到 octopress\plugins\ 文件夹里面。

Step 2 . 将下面的代码复制到 octopress\source\_includes\custom\asides\tags.html。（这个文件需要你自己新建。） 注意： 先去掉 % 前面的反斜杠。

1
2
3
4
5
6

<section>
  <h1>Tags</h1>
  <ul class="tag-cloud">
    {\% tag_cloud font-size: 90-210%, limit: 15, style: para \%}
  </ul>
</section>

解释上面这段代码：

tag_cloud 的参数中。 font-size 指定 tag 的大小范围；limit 限定 15 个 tag ；style :para 指定不使用 li 来分割。

Step 3 .

在 octopress\_config.yml 中的 default_asides 中添加 custom/asides/tags.html。

1

default_asides: [custom/asides/tags.html, .....]

现在执行 rake generate 生成博客。在使用 rake preview 在本地预览博客。

你会发现，在导航栏里面出现了 Tags 字段，但是里面没有标签。（不用担心，你已经成功添加了标签云。只不过你的博文里面没有标签，所以在标签云里面就没有标签。）

我们写一个带标签的博文。怎么写一个带标签的博文：

1

tags: [tag1, tag2, tag3]

执行 rake generate 命令时出现了问题：

解决：comparison of Array with Array failed in _layouts/page.html 错误

1

  Liquid Exception: comparison of Array with Array failed in _layouts/page.html

在 octopress\plugins\tag_cloud.rb 中第74行是这么写的:

1
2
3
4
5
6

if @limit > 0 and @sort != 'rand'
    # sort the tag pairs by frequency in descending order
    weighted.sort! { |a,b| b[1] <=> a[1] }
    # then slice off the top @limit tag pairs
    weighted = weighted[0,@limit]
end

weighted = weighted[0,@limit] 应该就是取指定数目的标签。如果你的标签数量少于 @limit ，那么就会报错。

所以我们修改第74行为:

1

  if @limit > 0 and @sort != 'rand' and @limit < weighted.length

同样的，将第95行修改为:

1

    if @limit > 0 and @limit < weighted.length

现在所有的修改都完成了，执行 rake generate 命令时，就不会再出现上面的错误了，但是现在却出现了下面的警告：

我们现在执行 rake preview 命令来预览看看。标签云是成功添加上去了:

解决 Build Warning: Layout 'nil' requested in tags/标签名/atom.xml does not exist. 警告问题

将 octopress\source\_includes\custom\tag_feed.xml 文件里面 nil 改为 null ：

1
2
3

---
layout: null
---

搞定，现在再执行 rake generate 命令就不会出现这个警告了。不会出现任何问题。

搞定

参考网站：

(扩充)为 octopress 添加标签云： http://yang3wei.github.io/blog/2013/01/30/zhuan-zai-wei-octopress-tian-jia-biao-qian-yun/ 分类标签： http://wiki.jikexueyuan.com/project/github-page/classification.html 在Octopress中添加标签： http://devma.cn/blog/2016/04/02/zai-octopresszhong-tian-jia-biao-qian/

• 我的电脑系统：Windows 10 64位
• SQL Server 软件版本： SQL Server 2014 Express

在库里面建表。所以我们现在需要先新建一个库，然后在库里面新建一个表。

所以，先建一个 库 ，取名为：test

输入新建库的名字：test 。 现在点击 确定 按钮。

如果你在创建库的时候，遇到了下面这个异常。请查看这篇博客解决问题。

新建成功：

我们现在在库里面在建表。

建表的方式有两种：一种是鼠标点击的方式；一种是输入命令的方式。（但是不推荐鼠标去点。如果你想要这个命令正确的执行成功，并且它很稳定，一般都是使用命令去实现。）

现在我们先来介绍如何使用鼠标来操作：

下面使用点击鼠标的方式（图形化界面 ）进行建表：

对着 库 的 表 点击右击，点击 表(T)…

列 名这里使用英文，后面选择 数据类型 。

目前第一个列取名为：emp_ename 。数据类型选择为：nvarchar(MAX) 。（表示的是：一个国际化编码可变的字符串。n 指的是：国际化，对汉字也支持；var 指的是：变量。所以：nvarchar(MAX) 指的是：可以存储汉字的字符串长度可以变化的字符串数据。）。后面的 允许 Null 值，如果你勾选了，意味着这一列的值可以是空的，所以我们不勾选。 其它列按照员工表对应的输入。

最终建出来的表就是下面这个样子的。（我们现在还没有添加 部门编号，为什么不添加？因为现在我们还没有部门这个表。（所以，如果我们先新建部门表，再建员工表就好了。））

nchar 中的 n 指的也是：支持国际化，支持汉字。

现在按 Ctrl + S 保存，将这个表取名为：emp 。 点击 确定 按钮。

现在这个 员工 表建立完成。

现在，我们就可以在：对象资源管理器 里面看到 test数据库里面的 表 选单里面多出来一个 dbo.emp 表。

如果你没有在这里面看到刚刚新建的 dbo.emp 表。进行下面的操作：（刷新一下，就出现了。）

展开 dbo.emp 表，你可以看到：

现在还没有添加主键。（刚刚并没有设置主键。）如果没有主键，数据就容易 冗余。

举个例子：

在表中添加内容：

如果添加的两条记录一模一样，那么得到的数据就 冗余 了。

如何添加记录？

数据添加完之后，点击框框中的地方：

点击后，红色的叹号消失：

如果你添加的是冗余的数据，还有在点击执行按钮，叹号才会消失。

在设计字段的时候，编号就是不能重复的，但是上面的两条冗余数据导致了编号的重复，所以现在编号就不能设置为主键了。不信，我们现在来试试。

对表的结构进行修改，点击 设计

对 emp_id 属性 右键 ，选择 ：设置主键(Y)

然后保存。（保存就会出错。）

目前数据里面的 emp_id 属性有重复的数据，现在你又想将其设置为不可重复的主键，所以就出错了。

现在，我需要将表里面的 emp_id 属性里的数据进行修改。目的就是：不能让里面的数据内容重复。（我使用图形界面（就是鼠标点击）的方式修改不了表里面的数据；我们修改数据使用敲命令的方法也是修改不了的，这说明了：数据不能有冗余。）

我们现在只能将两条数据都删除。（使用图形界面（就是鼠标点击）的方式删除不了的；我们修改使用命令来删除）

新建一个查询文件（.sql 后缀的文件）。

在里面输入下面的命令：

1

delete from emp

点击 执行 按钮。

现在数据还在。

点击 执行 图标。

数据消失。（这个软件真是好弱啊！）

折腾了一顿。

下面使用点击鼠标的方式（图形化界面 ）进行建主外键约束：

所以，我们应该先设置主键，然后 Ctrl + S 保存。接下来在添加数据。这才是正确的步骤。

接着添加，数据：

现在有了主键，导致了：主键里面的数据不能一样。

现在，我们在写一个表： 部门表 。并添加下面的数据，同时将 dept_id 属性设置为 主键。

按 Ctrl + S 保存此表，命名为：dept

注意：数据是中文的无所谓。但是你不要把表的结构和库的结构也写成中文。

现在我们来到 emp 表。添加 dept_id 这个属性（注意：这个属性的 允许Null值要勾选）。（目的是：将其设置为外键）

然后右键，点击 关系

然后点击 添加

点击 下面红框框里面的按钮。

设置为下面这个样子。将 dept_id 这个属性设置为 外键。

解释一下：存在外键的表叫做 外键表，（外键：就是来自于另外一个表的主键）。 emp（员工） 表里面有一个dept_id （部门编号）这个外键，它就是 dept （部门）表的主键。

点击 确定， 再点击 关闭。现在按 Ctrl + S 保存，会弹出下面的窗口。点击 是 按钮。

我现在在 dept （部门）表里面添加数据。

现在再来到 emp （员工）表里面，给dept_id（部门编号）（外键） 添加数据。（如果你打开emp表发现里面现在还没有dept_id这个属性，就关闭这个页面，重新打开这个emp表，就有了。（这个软件正弱！））

我们来总结一下：应该先建部门表，然后在建员工表，是最好的。也就是说：先建主键表，然后再将外键表（因为外键表有数据来自另外的表（主键表））。

• 我的电脑系统：Windows 10 64位
• SQL Server 软件版本： SQL Server 2014 Express

我们来介绍一下：数据库是如何存储数据的。

数据库是如何存储数据的

来看一个小例子

现在，假如我们现在想存储 员工的信息。也就是说：我们来通过这个例子来看看 字段、记录、表 是一个什么东西。

我们下面通过存储一个员工的信息，来把这些专业术语都来解释一遍。

假设有4个信息：

| 员工姓名 | 员工工资 | 员工性别 | 员工年龄 |

我们能不能这样去存储数据。比如举例：

如果我们按照正常的思维，这样存储是没有问题的。（其实这个员工表还缺少一列数据）但是如果我们真的在数据库里面这样存储数据的话，是会出问题的。 我们想象一下：如果你只是写了员工的姓名、工资、性别、年龄，将来可不可能会出现一个人和里面员工的人有一模一样的姓名。如果出现了一模一样的数据，数据库该如何辨别？

所以，它需要设置一个东西，来标识唯一的记录（行）。

如果信息（行）一样，那么保存起来就浪费了，术语叫：冗余。（简单的说：就是有两条数据彼此之间无法辨别了。）

Q： 那我们怎么办？

A： 我们在现实中，是使用编号来解决这个问题的。

不管是人也好，产品也好，都是使用编号来标识唯一的一个事物的。

主键

所以：

张三这个人之前有4个属性：姓名、工资、性别 和 年龄。而确定一个数据唯一性的属性，有一个专门的词：主键。（当前例子指的就是：学生编号。）（现在张三这个人有5个属性了。）

主键：它也是事物的一个属性，它是可以标识事物唯一性的属性。

如果我们这样存放：

那么 部门姓名 和 部门地址 还有 部门人数 都会重复的出现，这样存储太消耗空间了。

所以我们将他们分开存储：

Q： 请问： 部门 需不需要 编号 这个属性呢？

A： 需要。

记住：我们设计任何一个事物都需要主键（唯一的标识符）。如果没有唯一的标识符，那么事物和事物之间的区别就没有了。

所以，只要你想存数据，数据就必须要有主键。没有主键，事物与事物之间没有办法区分。添加主键就是添加编号属性。

比如说人。人的身份证算不算是一个人的属性，身份证是单独添加的。我们人有鼻子，眼睛，嘴。身份证严格上讲并不是一个人的属性，只不过是为了标识，使用编号是很方便的。所以每个人才有了身份证号这个属性。

编号（主键）是无意义的，但是因为它太普遍的，我们认为它有意义。

在保存数据的时候，都是单独添加一个没有实际意义的、只为了编号的 数据来充当主键。它只起个标识作用。（现实生活中我们就是这样使用的，在实际的设计库的时候，我们也是这样设计的，和我们日常中是一模一样的。）

外键

Q： 员工和部门之间是有关系的，那么这个关系怎么去表达？

Q、： 如果，我们想要将现实生活中特别复杂的事物保存到硬盘上，我们要如何存储？

你应该这样去考虑：

第一：个体如何存储；

第二：个体之间的关系如何存储。

把这两个搞定了，基本就都搞定了。

我们现在已经解决了个体如何存储。接下来就是个体之间的关系如何存储了。我们主流使用的数据库都是关系型数据库（就是一个二维表），而我们使用的编程语言是Java、C#这种面向对象的语言，这两种完全不同的解决问题的思想。

Q： 中间服务器是使用Java 或者 C# 实现的，后端是数据库实现的，它们之间如何进行交互的？

A： 是通过Hibernate实现 一个映射，日后的博客中会介绍它。（如果日后，我们的数据库也是使用面向对象的思想实现的，那么这个Hibernate 就没用了。但是现在没有面向对象的数据库，这种思想的数据库技术还不成熟，所以 Hibernate现在还是需要学习的。）

Q： 什么是面向对象，大家已经知道了。但是，什么是关系？

A： 面向对象思想是通过类来实现的，而关系型数据库是通过表来实现的。而表与表之间的关系是通过什么来实现的呢？是通过一个叫：外键 的东西来表示的。

我们现在在员工表里面在添加一个：部门编号。

扩展：（编号通常是整型数字，如果数据量太大，整型数字不够用的话，编号通常是字母和数字组合使用。当时我们推荐编号使用整型数字。因为整型查找的时候很快，而字符串查找的时候很慢。）

这个 部门编号 就是 外键。我们在员工表上添加了一列（部门编号），就解决了 表（员工表）与 表（部门表）之间的关系了。

Q： 我们想象一下，如果我们不在员工表里面添加 部门编号。而是在 部门表里面添加 员工编号。这样行不行？

A： 当时是不行的，一个部门里面里面有很多的员工，并且员工的数量不同。所以，如果我们在部门表里面添加员工编号的话，有些部分的字段就很多，而有些部门的编号就很少，这样就不合适了吧。如果你想这样设计也可以，但是这样设计不好。

你在设计表之前，要想：员工与部门之间的关系是一对多还是多对一。意思就是：一个员工 对应 很多部门，还是 一个部门 对应 很多员工？ 是一个部分对应多个员工。我们会将外键添加到多的一方，这样是最合理的。

我们日后会讲：多对多，一对一，一对多 这样的情况下，都如何使用外键来表示关系。现在大概有个印象就可以。

Q： 再解释一次：什么是外键？

A： 连接两个表的字段叫做外键。

但是能不能再换一种更好的解释方式。主键是：标识唯一一个事物。而外键是：一个表中的数据来自另外一个表。（解释：员工表里面的一列数据（部门编号），它不是员工表本身的，它的数据是来自另外一个表（部门表）。）

总结：

在数据库里面的专业术语：

这样的一列叫：列 或者 字段。模拟的是：一个事物的某一个静态的特征。列：字段的另一种称谓。

这样的一行叫：记录 或者 元组。模拟的是：字段的组合，表示的是一个具体的事物。元组：记录的另一种称谓。

这样的一行叫：记录 或者 元组 或者 属性。属性：记录的另一种称谓。

这一个整体叫：表。记录的组合。模拟的是（表示的是）：同一类事物的一个集合。

表、字段和记录的关系：

• 字段是事物的属性
• 记录是事物本身
• 表示事物的集合

表中唯一能辨别一个记录与另一个记录不同的字段叫：主键。

如果有一个记录（列）不是来自于表本身的，是来自另外一个表的，它叫：外键。

下载

（Notepad 文本编辑器软件是免费的，并且非常的好。属于电脑必备软件。）

到这个网站下载：https://notepad-plus-plus.org/download/v7.html

点击相应的 安装包 进行下载： （我电脑是64位的，所以下载64位的。Installer 是安装包； 压缩包 是绿色版的，下载解压后直接就能使用，无需安装。）

安装

什么都不选，直接下一步。

搞定

字体配置文件在 octopress/sass/custom/ 文件里面：_fonts.scss 文件。

默认情况下字体配置都是被注释掉的。我们将注释都去掉。

1
2
3
4
5
6

$sans: "Optima", sans-serif;
$serif: "Baskerville", serif;
$mono: "Courier", monospace;
$heading-font-family: "Verdana", sans-serif;
$header-title-font-family: "Futura", sans-serif;
$header-subtitle-font-family: "Futura", sans-serif;

引号里面的是：字体名。后面跟的是：sans-serif(无衬线字体)、serif（衬线）、monospace（等宽字体）。

• $sans：定义的是无衬线正文的字体
  • 
• $serif：定义的是衬线正文的字体
• $mono：定义的是代码的字体
• $heading-font-family：定义的是文章标题的字体
• $header-title-font-family：定义的是博客标题的字体
• $header-subtitle-font-family：定义的是博客子标题的字体

我将它们修改为下面这样的配置。（就是将所有的字体都设置为：Comic Sans MS）

1
2
3
4
5
6

$sans: "Comic Sans MS", sans-serif;
$serif: "Comic Sans MS", serif;
$mono: "Comic Sans MS", monospace;
$heading-font-family: "Comic Sans MS", sans-serif;
$header-title-font-family: "Comic Sans MS", sans-serif;
$header-subtitle-font-family: "Comic Sans MS", sans-serif;

现在执行 rake generate 命令生成博客站点。在执行 rake preview 命令在本地开设4000端口。在浏览器中浏览 localhost:4000 端口进行预览。（效果不错。）

参考网站： 利用Octopress和Github搭建个人博客（四）：自定义字体 http://glgjing.github.io/blog/2015/01/31/li-yong-octopresshe-githubda-jian-ge-ren-bo-ke-(si-):zi-ding-yi-zi-ti/

README.md 文件里面是有中文的。在 GitHub For Windows 客户端软件里面显示中文是乱码的。

解决办法：

Step 1 . 将 README.md 文件使用 Notepad++ 软件打开。 （如果你的电脑上没有 Notepad++ 软件，你可以参考这篇博客来下载安装它。）

Step 2 . 选择： 格式 -> 转为 Utf-8 无 BOM 编码格式

Step 3 . 保存 README.md 文件

Step 4 . 将修改重新推送到 GitHub 远程。

问题解决：

GitHub For Windows 客户端软件是一个非常好的软件，它实现了：即使你不会 git 命令行工具的时候，一样可以使用 GitHub For Windows 客户端软件里面简单点的点击按钮就可以一样将代码推送到 GitHub 远程。

下载、安装、配置 GitHub For Windows 客户端软件的图文教程可以参考这篇博客。

因为 GitHub 在推送代码到远程的时候，会自动将所有文件的编码方式转换为 UTF-8 ，所有在网页里面浏览你的 GitHub 仓库的时候，中文是不会出现乱码的。 但是在本地，要想在 GitHub For Windows 客户端软件里面也能正常看到 中文，而不是乱码，就要自己手动的将含有中文的文件转换为：UTF-8编码方法。（如果是 Windows 系统就要转为：Utf-8 无 BOM 编码格式）