博客框架选择以及发布博客

jopen 8年前

框架选择

随着web技术的不断发展,可以产生静态博客的框架也越来越多,比如流行的 jekyiioctopressHexoHugo ,以及middleman,Pelican,Metalsmith。小G比较过集中常用的框架,比如github自带的jekyii,还有hugo。最后选择了Hexo。

  1. Github Pages默认使用jekyii作为建立静态博客的framework,但是对于jekyii,小G觉得一方面jekyii安装太过复杂,然后相对于其他的framework比较慢,所以就试了一下就没有再用了
  2. Hugo听说轻量级以及速度很快,尝试了一下果然很快。然后跑去他的官网看文档,写的是很清楚。有一个问题是它的不同的theme有不用的configuration,所以在theme之间切换不是很容易,而且由于是轻量级的所以有很多东西需要自己配置,上手有点慢。
  3. 第一次用到hexo的时候觉得这个框架非常容易上手,一共就五个命令:hexo n, hexo clean, hexo g, hexo s, hexo d,从开发到配置到发布全部搞定。而且theme之间的切换也非常容易,而且大部分的configuration都已经集成,很容易使用。
  4. 这些做静态博客的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
</div>

安装完之后在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/
</div>

Hexo配置

然后就是Hexo的配置了,首先是新建文件夹:

$ hexo init <folder>  $ cd <folder>  $ npm install
</div>

然后文件夹里面的路径应该就如下所示:

.  ├── _config.yml  ├── package.json  ├── scaffolds  ├── source  |   ├── _drafts  |   └── _posts  └── themes
</div>
  • _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"
</div>

这个会新建一个post在source/_post文件夹下,是md的格式,你可以在里面写你要发布的内容。

$hexo generate  $hexo g
</div>

这个会根据你的markdown以及配置生成静态文件,你可以deploy到github里面

$hexo serve  $hexo s
</div>

这个会在本地新建一个server host你刚刚生成的静态文件,你就可以在本地预览你的静态网站。

$hexo deploy  $hexo d
</div>

这个会根据你的配置发布到你需要的host网站上。比如小G想把它发布到github page上,在_config.yml文件里就要配置deploy:

deploy:    type: git    repository: https://github.com/Gabriel0402/gabriel0402.github.io.git    branch: master
</div>

这样你都不用commit和push就可以自动发布到你的github page里面。是不是一键搞定?

当然如果你要deploy或者可以安装github desktop把你的计算机加入到github中,另一个方法是加sshkey,详见: 如何搭建一个独立博客——简明Github Pages与Hexo教程

最后一个命令是clean,帮你clean cache然后发布,因为有时候hexo不能检测到你的内容的更改,所以你需要clean了cache之后再generate。

$hexo clean
</div>

通常小G还会写两个script直接自动化整个流程:

  1. 写完一个post想在本地测试:

    hexo clean  hexo g  hexo s
  2. 写完一个post想直接发布:

    hexo clean  hexo g  hexo d

想要run这个script直接可以

sh run.sh
</div>

在theme基础上建立自己的博客

在试完这些功能之后我们可以尝试改变_config.yml的设置来选择我们自己的style。比如Yelee这个theme,当我们把它安装到theme文件夹下后,他自己也有_config.yml文件:

比如我们想改左边的导航栏,可以在header下改:

# Header  menu:    Homepage: /    Archives: /archives/    #Tags: /tags/随笔    TagCloud: /tags/    About: /about/
</div>

然后再这个文件里你可以改其他比如背景图片,头像图片,分享,这些在注释里都有标注。

Hexo的整个workflow很简单,值得一试。

原文 http://gabriel0402.github.io/2015/12/13/blog/