1. Hexo简介

Hexo 是一个快速、简洁且高效的博客框架。Hexo 使用 Markdown（或其他渲染引擎）解析文章，在几秒内，即可利用靓丽的主题生成静态网页。安装 Hexo 相当简单。然而在安装前，您必须检查电脑中是否已安装下列应用程序：

1 2	Node.js Git

2. nodejs和git的安装

Node.js是一个能够在服务器端运行JavaScript的开放源代码、跨平台JavaScript运行环境。 Node.js 使用高效、轻量级的事件驱动、非阻塞 I/O)模型。它的包生态系统，npm，是目前世界上最大的开源库生态系统。我们可以直接从官网下载最新的nodejs 并安装（https://nodejs.org/zh-cn/).

除此之外,在Mac上还可以通过使用 Homebrew 安装 Node.js，具体命令:

1 2	$ brew update $ brew install node

安装后，Terminal依次输入：

1 2	$ node -v $ npm -v

来查看电脑上安装的版本号,确保其版本号为较新的，这样使用npm安装hexo才不会出现一系列问题。

如果node为旧版本，可以通过Terminal：

1
2
3

$ sudo npm install -g n # 管理nodejs的版本
$ sudo n latest # 升级到最新版本
$ sudo n stable # 升级到稳定版

git的安装相对简单,在Mac上可以使用Homebrew来安装:

1	$ brew install git

3. 安装 Hexo

所有必备的应用程序安装完成后，在终端依次输入并回车:

Terminal:

$ mkdir hexo
$ cd /hexo
$ npm install -g hexo-cli
$ hexo init blog
$ cd blog
$ npm install
$ hexo g -d  # 生成静态文件并部署博客到远端（比如github, heroku等平台）

打开浏览器，输入http://localhost:4000/ ，看到以下页面说明hexo环境安装成功。

Ps.安装好了hexo以后,注册一个github账号,创建一个repo,将hexo和repo关联起来.最后效果图如下:

4. 个性化Blog

在Hexo中有两份主要的配置文件,其名称都为_config.yml.其中,一份位于站点根目录下,主要包含Hexo本身的配置(站点配置文件);另一份位于主题目录下,这份配置由主题作者提供,主要用于配置主题相关的选项(主题配置文件).

1. Next主题

Next主题的安装:

1 2	$ cd your-hexo-site $ git clone https://github.com/iissnan/hexo-theme-next theme

然后在站点的配置文件中修改:

1	theme: next

2.验证主题

启动本地站点:

1 2	$ hexo c #清除站点缓存 $ hexo s

当命令行输出一下信息表示站点正确运行:

1	INFO Hexo is running at http://0.0.0.0:4000/. Press Ctrl+C to stop.

3.主题设定

Scheme 是 NexT 提供的一种特性，借助于 Scheme，NexT 为你提供多种不同的外观。同时，几乎所有的配置都可以在 Scheme 之间共用。目前 NexT 支持三种 Scheme，他们是：

Muse - 默认 Scheme，这是 NexT 最初的版本，黑白主调，大量留白.
Mist - Muse 的紧凑版本，整洁有序的单栏外观
Pisces - 双栏 Scheme，小家碧玉似的清新,小清新,我喜欢.

关于博客的菜单,侧栏,站点描述等设置,可以参考:http://theme-next.iissnan.com/getting-started.html

1. 头像设置

博客怎能没有一个有个性的头像呢?然而头像设置让我在折腾了好久好久,周六晚上弄到半夜四点多,最惨的是还没有弄好~醉了.具体步骤如下:

选择一个中意头像.如:love.jpg
打开主题配置文件_config.yml

找到如下信息,并进行配置:

1
2
3

custom_log:
  enabled: ture 
  image: images/love.jpg # 实际在image的love.jpg 要改为 avatar.gif.

不知道为啥要这样.

2. blog中图片上传

将主题配置文件_config.yml 里的post_asset_folder:这个选项设置为true
此时运行下面命令生成博客时:
1
$ hexo n demo

在/source/_posts文件下除了demo.md,还会有一个demo文件夹

在博客的根目录下:

1	$ npm install hexo-asset-image --save # 有点慢,耐心等待

在demo.md中想要引入love.jpg图片时,只需要将love.jpg放到demo文件夹下,然后demo.md中写:
1
![你想输入的替代文字](love.jpg)