框架选择
随着web技术的不断发展,可以产生静态博客的框架也越来越多,比如流行的 jekyii , octopress , Hexo , Hugo ,以及middleman,Pelican,Metalsmith。小G比较过集中常用的框架,比如github自带的jekyii,还有hugo。最后选择了Hexo。
- Github Pages默认使用jekyii作为建立静态博客的framework,但是对于jekyii,小G觉得一方面jekyii安装太过复杂,然后相对于其他的framework比较慢,所以就试了一下就没有再用了
- Hugo听说轻量级以及速度很快,尝试了一下果然很快。然后跑去他的官网看文档,写的是很清楚。有一个问题是它的不同的theme有不用的configuration,所以在theme之间切换不是很容易,而且由于是轻量级的所以有很多东西需要自己配置,上手有点慢。
- 第一次用到hexo的时候觉得这个框架非常容易上手,一共就五个命令:hexo n, hexo clean, hexo g, hexo s, hexo d,从开发到配置到发布全部搞定。而且theme之间的切换也非常容易,而且大部分的configuration都已经集成,很容易使用。
- 这些做静态博客的framework都比较灵活,可以不费很多时间和精力从一个迁移到另一个,所以小G认为如果对这感兴趣可以把主流的framework都试一遍,找到自己最好的。小G本人觉得最好用的是hexo,所以决定使用这个framework。
发布博客
才开始写博客,所以小G打算使用gitpage来host这个静态的网站。
建立github page 仓库
在登录github后,新建一个仓库: [username].github.io。
这个仓库每个github账户只能建立一个,不过这是免费的,已经很不错了。
Hexo安装
首先是安装hexo,你在电脑上需要安装nodejs和git。然后就可以安装hexo:
$ npm install -g hexo-cli
安装完之后在command line 里面测试hexo是否安装好,直接输入hexo看是否会有如下信息:
sage: hexo <command>
Commands:
clean Removed generated files and cache.
config Get or set configurations.
deploy Deploy your website.
generate Generate static files.
help Get help on a command.
init Create a new Hexo folder.
list List the information of the site
migrate Migrate your site from other system to Hexo.
new Create a new post.
publish Moves a draft post from _drafts to _posts folder.
render Render files with renderer plugins.
server Start the server.
version Display version information.
Global Options:
--config Specify config file instead of using _config.yml
--cwd Specify the CWD
--debug Display all verbose messages in the terminal
--draft Display draft posts
--safe Disable all plugins and scripts
--silent Hide output on console
For more help, you can use 'hexo help [command]' for the detailed information
or you can check the docs: http://hexo.io/docs/
Hexo配置
然后就是Hexo的配置了,首先是新建文件夹:
$ hexo init <folder>
$ cd <folder>
$ npm install
然后文件夹里面的路径应该就如下所示:
.
├── _config.yml
├── package.json
├── scaffolds
├── source
| ├── _drafts
| └── _posts
└── themes
- _config.yml:最重要的配置文件,你可以配置任何博客的参数,比如theme,背景什么的。具体可以看 configuration ;
- package.json: 大概了解nodejs的同学都知道,这个是node的安装包的配置文件;
- source: 这里放了你所有要post的文档,支持markdown的格式;
- theme: 你可以安装不同的theme到这个文件夹,等你要使用某个theme的时候在_config.yml里面配置就好。
- scaffolds: Hexo根据scaffold来建立档案
新建博客
小G觉得要用hexo记住五个命令就好:
$hexo new “my blog”
$hexo n "my blog"
这个会新建一个post在source/_post文件夹下,是md的格式,你可以在里面写你要发布的内容。
$hexo generate
$hexo g
这个会根据你的markdown以及配置生成静态文件,你可以deploy到github里面
$hexo serve
$hexo s
这个会在本地新建一个server host你刚刚生成的静态文件,你就可以在本地预览你的静态网站。
$hexo deploy
$hexo d
这个会根据你的配置发布到你需要的host网站上。比如小G想把它发布到github page上,在_config.yml文件里就要配置deploy:
deploy:
type: git
repository: https://github.com/Gabriel0402/gabriel0402.github.io.git
branch: master
这样你都不用commit和push就可以自动发布到你的github page里面。是不是一键搞定?
当然如果你要deploy或者可以安装github desktop把你的计算机加入到github中,另一个方法是加sshkey,详见: 如何搭建一个独立博客——简明Github Pages与Hexo教程
最后一个命令是clean,帮你clean cache然后发布,因为有时候hexo不能检测到你的内容的更改,所以你需要clean了cache之后再generate。
$hexo clean
通常小G还会写两个script直接自动化整个流程:
-
写完一个post想在本地测试:
hexo clean
hexo g
hexo s -
写完一个post想直接发布:
hexo clean
hexo g
hexo d
想要run这个script直接可以
sh run.sh
在theme基础上建立自己的博客
在试完这些功能之后我们可以尝试改变_config.yml的设置来选择我们自己的style。比如Yelee这个theme,当我们把它安装到theme文件夹下后,他自己也有_config.yml文件:
比如我们想改左边的导航栏,可以在header下改:
# Header
menu:
Homepage: /
Archives: /archives/
#Tags: /tags/随笔
TagCloud: /tags/
About: /about/
然后再这个文件里你可以改其他比如背景图片,头像图片,分享,这些在注释里都有标注。
Hexo的整个workflow很简单,值得一试。