文章目錄

git配置

未完待续

github账号及使用

建立github账号
添加ssh keys

未完待续

使用github pages建立博客

github pages建立博客几种方式：

建立一个 username.github.com 的repo，username为你的github用户名，每个用户只能有一个这样的repo，则直接发布到master分支即可。
建立一个项目repo，发布的branch是gh-pages.

我们选择第一种，先创建一个repository,

再生成github pages页面

之后在浏览器中输入zhaodg.github.io进行查看是否创建成功。

Hexo

Hexo介绍

快速、简洁且高效的博客框架1

超快速度:Node.js 所带来的超快生成速度，让上百个页面在几秒内瞬间完成渲染
支持 Markdown:Hexo 支持 GitHub Flavored Markdown 的所有功能，甚至可以整合 Octopress 的大多数插件。
一键部署:只需一条指令即可部署到 GitHub Pages, Heroku 或其他网站。
丰富的插件:Hexo 拥有强大的插件系统，安装插件可以让 Hexo 支持 Jade, CoffeeScript。

hexo中所有文件的编码格式均是UTF-8。

Hexo安装及部署

前提需要安装node.js和git，在这里不做过多描述。

MAC安装：

/* http://hexo.io/zh-cn/ */

$ mkdir hexo && cd hexo  # 在你的工作目录下建立一个文件夹 用于存放hexo相关
$ npm install hexo-cli -g  # 安装hexo
$ hexo init blog  # 创建文件夹blog 用于存放静态博客相关
$ cd blog
$ npm install
$ hexo server  # 执行hexo server命令，在浏览器中输入http://0.0.0.0:4000/进行查看

效果见下图：

Hexo主题

测试中我们使用pacman主题（个人蛮喜欢目录索引这个小玩意儿）

1	$ git clone https://github.com/A-limon/pacman.git themes/pacman # 如需要更新，则执行git pull

修改blog目录下的_config.yml文件

1	theme: pacman

为了pacman主题支持代码高亮，修改themes/pacman目录下的_config.yml文件,并添加如下代码

1 2	highlight: enable: true

然后预览我们更换的主题,执行hexo server命令，在浏览器中输入http://0.0.0.0:4000/进行查看

1	$ hexo server

效果见下图：

Hexo部署到github pages页面

修改_config.yml文件

deploy:
  type: git
  repo: https://github.com/zhaodg/zhaodg.github.io
  branch: master

执行命令，安装插件及部署

$ npm install hexo-deployer-git --save  # 安装hexo-deployer-git插件
$ hexo clean  # 清理
$ hexo generate  # 生成静态页面，文件存在public文件目录下
$ hexo deploy  # 将静态页面部署到zhaodg.github.io上面

部署成功后，耐心的等待几分钟，然后在浏览器中输入http://zhaodg.github.io进行查看

Hexo使用

发表一篇新博客

1	$ hexo new 这是一篇新博客

执行命令后，会在source/_posts/这个目录下边生成[这是一篇新博客.md]文件，之后编写md文件，并执行hexo g -d,就会生成页面并部署到github pages上。

Hexo命令

$ hexo new "postName"  # 新建文章
$ hexo new page "pageName"  # 新建页面，其中page是scaffolds下的模板，这样新建的页面会带一些附属信息
$ hexo generate  # 生成静态页面，存放至public目录
$ hexo server  #  开启预览访问端口（默认端口4000，'ctrl + c'关闭server），访问链接http://0.0.0.0:4000
$ hexo deploy  # 将.deploy目录部署到GitHub
$ hexo clean  # 清理generate生成的文件和缓存

# 简写
$ hexo n  # 等价于hexo new
$ hexo g  # 等价于hexo generate
$ hexo s  # 等价于hexo server
$ hexo d  # 等价于hexo deploy
$ hexo g -d  # 等价于hexo generate + hexo deploy
$ hexo help  # 查看命令手册

# 任何hexo命令都可以使用前缀，比如"hexo server" == "hexo s" == "hexo se" == "hexo ser"

Hexo目录结构

$ tree -La 1
.
├── .deploy_git  # 执行hexo d命令部署到github上的内容目录
├── .gitignore  # git的忽略文件配置
├── _config.yml  # hexo配置文件
├── db.json  # 博客内容数据相关
├── node_modules  # hexo的插件存储目录
├── package.json  # hexo的版本号及安装插件等信息
├── public  # 执行hexo g生成的静态网页内容目录
├── scaffolds  # layout模板文件目录，可自定义模板文件
├── source  # 文章源码目录，该目录下的markdown文件和html文件都会被处理（404、favicon.ico、CNAME等）
└── themes  # 博客主题目录

Hexo配置

Hexo插件

http://hexo.io/plugins/

自定义页面

404页面

本人目前选用腾讯公益404页面，具体使用方法：

在source/页面下新建404.html文件
- 404.html文件具体代码如下

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
    </head>
    <body>
        <script type="text/javascript" src="http://www.qq.com/404/search_children.js" charset="utf-8" homePageUrl="http://zhaodg.github.io" homePageName="回到我的主页"></script>
    </body>
</html>

链接：

About页面

建立一个自定义页面：

在source目录下建立一个文件夹，叫about
在这个新目录下建立index.md或者index.html文件
修改themes下的_config.yml文件，添加About: /about字样，见下述代码：

##### Menu
menu:
  Home: /
  Archives: /archives
  About: /about

防止自定义html文件被render的方法

图片

本地存储图片：如果想使用Github存储图片，我们可以在 source/ 文件夹中新建 img 文件夹，将图片放在此目录下，然后在文章中使用 ![](../img/pic.png)格式插入图片即可。
cdn: 选七牛，然后直接写链接

七牛优点：（没有做广告，主要是免费，对于要获得如下资源，还要传照片，强烈鄙视）

10GB永久免费存储空间
每月10GB下载流量
每月10万次Put请求
每月100万次Get请求

链接：

Markdown

Markdown语法相关

Markdown编辑器

http://code.csdn.net/news/2819623

zhaodg

博客搭建