博客搭了好久了,前几天重新换了个响应式布局的主题,还挺清爽简洁的,顺便记录下搭建过程吧。

1. 域名

前段日子看到Godaddy .me域名做活动就心血来潮买了个域名,荒了一段时间,心想还是搭个blog吧,最后还是选择搭在GitHub Pages,折腾就折腾一些吧。

首先呢,得把NS换到DNSPOD, 可以参考官方帮助

2. GitHub Pages

不熟悉git和github?可以戳这篇史上最浅显易懂的Git教程

要在GitHub Pages搭建blog最好选择User or organization site,需要注意你的blog仓库名必须和你的github username相同,然后follow页面上剩余的步骤就算基本搭建完成,浏览器中输入username.github.io就可以看到效果。

绑定域名

下面是绑定域名到刚才搭建的pages,官方指导在这里。 简单说下步骤:

  • 在repository下新建一个CNAME文件,里面写入你的域名,如example.com
  • 到DNSPOD你域名的配置页面,如果是顶级域名example.com则配置两个A记录分别指向:

192.30.252.153

192.30.252.154

  • 配置顶级域名的话同时还要给www.example.com子域名配置一个CNAME记录,指向username.github.io ,这样别人输入www.example.com,github服务器会301重定向到example.com

  • 如果你是单个子域名,如blog.example.com只需配置一个CNAME记录即可,github推荐使用子域名,一来如果github服务器ip变了对于顶级域名你得去修改它的A记录,二来可以更有效抵御DoS和利用CDN加速。
  • 配置完成你可以dig一下查看解析情况

3. Jekyll

Jekyll 是一个静态页面生成模板引擎,GitHub Pages内置了对Jekyll的支持,所以你只要建立符合Jekyll规范的目录文件就可以被渲染成一个静态站点。

环境准备

先来搭建一下Jekyll本地环境,Mac自带了ruby,但是要装一下RubyGems,然后更改一下gem源:

gem sources --remove https://rubygems.org/
gem sources -a http://ruby.taobao.org/
gem sources -l
sudo gem update  —-system

一开始我是通过gem install jekyll单独安装jekyll等所需要的库,但是现在有更简单更易于管理的方式,官方指导在这里,首先需要安装一下bundler:

gem install bundler

Bundler通过Gemfile和Gemfile.lock来管理你整个project所依赖的RubyGems,你可以把需要的gems写到Gemfile中,然后执行bundle install,就会自动安装这些gems以及所依赖的其他库,并将所有的依赖信息保存到Gemfile.lock。别人可以通过copy你的Gemfile和Gemfile.lock来保持其环境的一致性。Gemfile看起来像这样:

source ‘http://ruby.taobao.org/’

gem ‘github-pages’

gem ‘coderay’

the GitHub Pages Gem这个项目将所有GitHub Pages所依赖的RubyGems包括插件整合成一个gem:github-pages,所以你只要在Gemfile中加上gem 'github-pages',就可以让你的本地环境保持和GitHub Pages环境一致,如果Jekyll等版本有更新,只需要简单的跑一下bundle update github-pages即可。

熟悉Jekyll

熟悉Jekyll最好就是clone一个用Jekyll搭建的站点到本地,这儿有很多,接着对照Jekyll的官方文档进行学习,列一下几个比较重要的点:

  • 目录结构
  • _config.yml,整个project的Jekyll配置文件
  • YAML头信息,Jekyll会特别处理带有这种头信息的文件
  • liquid模板语言,Jekyll对其进行了一些扩展,如使用Pygments语法高亮的tags写法:{% highlight java %}{% endhighlight %}
  • 插件,由于GitHub Pages生成sites时使用了--safe选项,所以自定义的插件无法支持,但是默认支持这些插件github-pages gem已安装这些插件

Markdown

Jekyll支持使用Markdown撰写blog,Markdown语法相当简单,若不熟悉,这儿有快速入门,Jekyll 2.0之后使用Kramdown作为默认的Markdown解析器,其他还有像Discount等,这些解析器都对标准Markdown有一些扩展与改进。Mac下较好的Markdown编辑器推荐mou,另外这个在线的编辑器感觉也不错。

4. Disqus

静态blog没有数据库,无法自己增加评论功能,好在有第三方的选择,如Disqus多说,个人更喜欢Disqus的整体风格,虽然国内速度较慢。配置也很简单,需要注意几个方面:

  • setup的时候选择Universal Code,然后它会提供给你两段code,一段是load Disqus,一段是display comment count,你可以将这两段写到一个html中然后放到_include目录下,在需要加载Disqus的页面中通过{% include xxx.html %}方式来引用,当然,要加载Disqus的页面还需要你在合适的位置加上<div id="disqus_thread"></div>,这个id就代表了Disqus的放置位置。
  • 对于显示评论数具体可参考这里,显示评论数的样式可以在Disqus的settings->general->Comment Count Link中配置,如我的配置:

count

  • settings->advanced->Trusted Domains该设置最好填上你的域名,它代表只有该域名及其子域名才能加载你的Disqus,置空则代表任何域名。

5. 其他选择

Jekyll的theme有很多选择,比如这里还有这里,你可以直接clone一个进行修改,除了Jekyll还可以选择OctopreshexoRuhoh等,GitHub上还有其他一些类似的静态blog系统。

6. TODO

  • 同时托管到gitcafe
  • 加个toc
  • Jekyll 2.0新特性
  • 保持热情写blog吧 :sunny:

Gradle的一些总结

Published on June 25, 2015

First Blog For Test

Published on August 03, 2014