从wordpress到octopress

octopress最 近很火，twitter上诸多geek都在谈论这个，octopress最为吸引我的地方就是其静态网页的方式，所以在这个诱因驱使之下，决定尝试一把 octopress。尝试之后，发现octopress吸引我的地方远不止静态网页这些方式，经过仔细对比，octopress比wordpress更加 的适合我

 

Wordpress Sucks

wordpress在某种意义上来说很“强大”，庞大的用户群和社区，无数的第三方开发者，许多主机提供商对wordpress的支持等等，对于许多人来说，wordpress几乎可以涵盖各个方面的需求。但是于我来说，wordpress有诸多的不舒服的地方：

 

• Over Featured wordpress目标是成为一个内容提供网站快速建站的模板，因此在设计上需要考虑各种各样的需求。对于个人博客来说，许多的设计都是多余而且无意义的。比如用户管理模块，这个对个人博客来说，是一个完全没有必要的东西

• 速度慢 对于一般访问量很低的博客来说，wordpress还可以撑住。但是对于一些突发访问很高的情况，wordpress基本上无法撑住。我们也经常可以看到一篇博文被广泛转载之后，主机因为访问过高而无法响应。对于这个问题，我曾经写过一篇wordpress调优的文章：优化Wordpress，提升访问速度，经过调优之后效果也还不错，但是也还没有发挥出主机的最佳性能。

• 过度依赖数据库 个人博客真的需要数据库么？答案是不需要，文章内容可以通过文件管理，用户评论可以使用Disqus，统计数据有Google Analytics，用户管理？上面说过了，这个模块对于个人博客来说真的不需要。因此wordpress把大量的请求时间放到了不必要的数据库请求上，可谓得不偿失。

• 可控性较差 wordpress的过于庞大，让你需要个人定制的时候需要花费很多的学习成本，虽然wordpress有插件系统，但是对于很多程序员来说，一些需求是要自己去实现的，但是面对wordpress这个庞大的系统，很难找到一个可以下手的地方，优化的门槛也很高

• 容错性差 这个也是跟wordpress过度依赖数据库有关，我在使用wordpress时候最为担心的问题就是，如果数据库挂掉了，我的文章内容是不是都丢失了。 因此我利用crontab每天导出数据库的内容来进行备份，wordpress一旦丢失数据库内容，将会是一无所有。。

• 迁移成本高 你如果换了一个主机，需要迁移wordpress，你会发现是一个很头疼的问题，需要搭建很多环境，需要导数据库，需要修改配置等等，对于一般非技术人来说，迁移成本实在是太高了

 

Why Octopress

A blogging framework for hackers

Octopress octopress.org/…

那，为什么要选择octopress呢？

 

• 纯静态 这是octopress最大的亮点，没有任何后台操作，只是html+javascript+css，不需要因为后台逻辑过多进行优化。对于Nginx或 者Apache来说，每秒处理上万次的html请求，这还是很轻松的事情，所以，就算有突发的访问，octopress是可以很好的保证响应时间的

• 版本化管理 octopress的操作流程是，先在本地写好一篇博文，然后用octopress提供的工具生成页面，然后通过rsync上传到服务器。因此，你可以把octopress提交到github上去作为你的一个项目，每次增加博文就是一次commit source的操作，更改也是如此，这样一来有几个好处，你可以查看博文的历史版本，不用担心自己的数据丢失（github帮你保存了数据）

• 可控性强 octopress本身提供的是一个生成博客的工具+博客的模板，而博客模板代码十分清晰，你可以很容易去定制自己的博客，去掉不必要的东西，增加新的东西。当然这得要求你有编码基础

• 迁移成本低 octopress几乎没有迁移成本，首先因为是纯html，因此不需要搭建额外的环境，再一个是，octopress的rsync功能，可以让你一键把你的博客同步到任何你想要的服务器上去

• 简洁的Ruby框架 Ruby的gem，rake这些框架使得octopress的操作变得十分容易上手，而且因为ruby语言的诸多优良特性，使得octopress的框架十分的轻便容易

• Markdown语法 octopress另一个大亮点是，博客使用Markdown作为源文件语言。Markdown语言由于其简单，易读和清晰的脉络结构的特点，被许多网站采用，比如Github，Google Code，StackOverflow，他是一个很好的文档语言，可以写出很漂亮的文档出来

 

For Whom

虽然octopress拥有许多令人兴奋的特性，但是他并不是一个大众化的东西，octopress是有其特定的适用人群的：

• 有一定的编码基础，特别是能够理解html，javascript和css，如果有ruby基础那将更好
• console fans，如果你都没有使用过console的经历，octopress显然不适合你
• 文章内容以plain text居多，少量的图片，如果你是一个需要富媒体体验的人，octopress对于你来说有点简洁
• 使用过git或者hg版本系统的人，将会在octopress上有更好的体验

 

How To

下面的内容我将主要介绍如何从wordpress迁移到octopress，希望能够帮到有兴趣迁移的朋友

 

初始化设置

这里官方文档有很详细的说明，我在这里就不赘述，你可以按照官方文档的内容step by step，如果遇到什么问题欢迎来讨论

 

部署设置

官方文档 介绍了Github Pages、Heroku，Rsync三种部署方法，对于拥有VPS或者共享主机的人来说，应该采用Rsync方法，Rsync的文档见这里

 

版本管理

你可以先去github上新建一个空的Repo（最好是private的，否则可能会被其他人拿到你的source），拿到repo的url，然后到octopress目录下执行下面这些操作：

# 因为你是从octopress github上clone的，所以你需要把origin这个branch换一个名字
git remote rename origin octopress
git remote add origin (your github url)
# 把你的github branch作为默认的branch
git config branch.master.remote origin
# 把你的octopress导入到github上去
git push -u origin master

 

 如果你新增加了博客或者修改了某些内容，你可以把你的改动commit到github上去：

git add source
git commit -a -m 'new blog or edit some blog'
git push -u origin master

如果octopress有更新，你可以直接pull octopress这个branch进行更新即可

git pull octopress master
git push -u origin master

 

迁移

这一部分也是我要详细说明的部分，这里需要花费你大量的时间。

 

导出Wordpress内容

JekyII的Github Wiki上介绍了通过数据库导出数据的方法，但是，本文还是更加推荐xml导出的方式

去你博客的 http://blog.example.com/export.php页面选择导出内容，你可以只选择导出博文，你会得到一个xml文件

 

转换xml

假如你得到的xml文件是wordpress.xml，我们现在开始转换这个xml，下面有几种方法供你选择

 

Jekyll的导出脚本

cd ~/octopress/source
mkdir _import
gem install open_gem jekyll sequel
cd ~/.rvm/gems/ruby-1.9.2-p290/gems/jekyll-0.11.0/lib/jekyll/migrators
cp wordpressdotcom.rb csv.rb ~/octopress/source/_import/
cd ~/octopress/source
ruby -r './_import/wordpressdotcom.rb' -e 'Jekyll::WordpressDotCom.process("wordpress.xml")'

 

上面内容执行完成之后会在你的_posts下面生成转换好的html文件，但是这些文件是不可以直接拿过来用的，需要修改（后面再讲）

 

这个导出脚本的不好的地方就是，导出的内容是纯html，不是markdown语法

 

某个导出脚本

你可以去https://gist.github.com/1274521这里下载这个导出脚本，把下载的文件解压之后重命名成wordpress.rb，然后执行下面操作：

mkdir ~/octopress/source/_import
mv wordpress.rb ~/octopress/source/_import
cd ~/octopress/source
ruby _import/wordpress.rb wordpress.xml

 

这个脚本会把生成的文件放到_posts下，文件名采用的是日期+wordpress_id的方式（上面的是日期+title），脚本生成的文件是markdown语法的文件。但是你同样不能够直接去使用它

 

修改转换内容

这一步是最为耗时的过程，你首先需要对基本的Markdown语法有一定的了解，中文Markdown语法文档见这里，你需要认真阅读以下这个文档

接下来，就是要修改内容。

 

修改博文链接

首先你需要修改的是那些博文中指向你其他博文的链接，因为permlinks的改变，使得这些链接可能全部失效，比如，以前的wordpress链接可能是：

http://blog.example.com/?id=123

 

或者

http://blog.example.com/archives/123

 

而octopress的permlinks都采用日期+标题的方式，比如本文的链接就是：

http://blog.fangjian.me/posts/2011/12/18/migrate-wordpress-to-octopress/

 

所以你需要在有这样链接的文章内容处进行修改

 

修改上传的图片路径

在wordpress中，你如果插了一张图片，会有这样的路径：

http://blog.example.com/wp-content/uploads/2011/12/xxx.png

这样的话你需要首先把这些上传的内容拷贝到octopress中去：

cp -r ~/wordpress/wp-content/uploads ~/octopress/source/

 

如果是跟上面一样的拷贝的话，那么图片链接需要变成：

http://blog.example.com/uploads/2011/12/xxx.png

 

修改代码高亮部分

如果你在wordpress中采用了代码高亮的工具，那么你就需要对这部分进行转换。wordpress常见的代码高亮格式是：

<pre class="brush:bash">
echo "hello world"
</pre>

 

或者：

<pre lang="bash">
echo "hello world"
</pre>

 

octopress原生支持代码高亮，你可以把上面的代码转换为：

{% codeblock lang:bash %}
echo "hello world"
{% endcodeblock %}

 

更详细的文档，请见此

 

修改wordpress插件代码

如果你的wordpress博客中插入了一些只能通过wordpress插件才能解析的代码，你需要将这部分代码改掉或者删除，否则octopress将无法正确解析这些代码

 

Optional: 尽量采用Markdown语法

Markdown文档中是可以包含一些html tag的，所以wordpress一些文章中的tag例 如<a>、<img>、<strong>、<p>、<span>等等这些都可以被正确解 析，但是我在这里建议如果可以使用markdown语法的尽量使用markdown语法，这样源文件变得非常的可读，美观，比如：

将：

<a href="http://example.com" title="Hello">
Hello World
</a>

 

替换成：

[Hello World](http://example.com, "Hello")

 

把:

<img src="/a/b/c/d.jpg"  class= "aligncenter" width=100 height=100 title="Haha" alt="" />

 

替换成：

{% img center /a/b/c/d.png 100 100 "Haha" "" %}

 

这是Octopress支持的Image Tag方式，详细文档可以见这里

 

完成迁移

如果你把上面说的这些转换工作完成了，那么你基本上就完成了从wordpress到octopress的迁移，你接下来只需要generate和deploy即可：

rake generate
rake deploy

 

在deploy之前你也可以在使用rake preview在localhost:4000上查看预览结果

 

修改页面配置

如果你需要修改页面配置，增加导航栏链接，修改header和footer等等，你可以参考这篇文档和这篇文档，里面会告诉你一些如果修改页面样式的方法。

 

如果你需要对生成进行配置，你需要修改_config.yml文件，可以参考这个文档

 

一些问题

之前的链接失效

从wordpress迁移过来之后，之前的/?id=123或者/archives/123这样的链接会失效，这样如果别人是通过搜索引擎到你的博客上去的话，就无法访问这些链接了，所以你需要针对这个情况进行特殊处理，可以使用Apache或者Nginx的rewrite方法，我以Nginx作为例子，你可以在/etc/nginx.conf里面进行如下配置：

rewrite /archives/382 http://blog.fangjian.me/posts/2011/10/18/how-to-beat-the-cap-theorem/ permanent;
rewrite /archives/321 http://blog.fangjian.me/posts/2011/09/25/tune-wordpress/ permanent;

 

这是我博客的例子，你可以根据你的url改变来增加这样的规则。rewrite permanent是使用HTTP 302的方式进行跳转，这样搜索引擎会把你新地址记下来，下次搜索的时候地址就会变成现在的地址，所以一段时间后你可以把这个配置去除掉。

 

优化Nginx配置

虽然是静态网页，不用刻意优化，但是为了让nginx达到比较好的性能，可以对他进行简单优化，主要是在页面压缩和浏览器缓存上。

 

页面压缩——在/etc/nginx.conf的http这个section增加如下配置：

gzip on;
gzip_min_length 1100;
gzip_buffers 4 8k;
gzip_comp_level 2;
gzip_proxied any;
gzip_disable "MSIE [1-6].(?!.*SV1)";
gzip_types text/plain text/css application/x-javascript text/xml application/xml application/xml+rss text/javascript;

 

浏览器缓存——在/etc/nginx.conf的server这个section中增加如下配置：

location ~* \.(js|css|png|jpg|jpeg|gif|ico)$ {
      expires 30d;
      log_not_found off;
}

 

这样的话，你的网站将会达到一个不错的性能

 

Minify Javascript和CSS

octopress生成的javascript和css有一些是没有进行minify的，经过minify后的js和css大小将减少很多，这样浏览器加载页面的时间会缩短，所以，你最好是在deploy之前把js和css压缩一下

 

我采用的是YUI Compressor，也就是yahoo的开发者工具，你可以去这里下载 ，下载完成后执行如下操作：

unzip yuicompressor-x.y.z.zip
mkdir ~/.tools
cp yuicompressor-x.y.z/build/yuicompressor-x.y.z.jar ~/.tools
mkdir ~/octopress/scripts
touch ~/octopress/scripts/minify.sh

 

上面~/octopress/scripts/minify.sh的内容是：

#!/bin/bash
old_pwd=`pwd`
base_dir=`dirname $0`/..
base=`cd $base_dir; pwd`
cd $old_pwd
find $base/public -iname "*.js" | while read file
do
    echo "minifying $file"
    java -jar $HOME/.tools/yuicompressor-x.y.z.jar --type js -o $file $file
done
find $base/public -iname "*.css" | while read file
do
    echo "minifying $file"
    java -jar $HOME/.tools/yuicompressor-x.y.z.jar --type css -o $file $file
done

 

Note：把脚本中的x,y,z替换成你的YUI Compressor版本号即可

每次deploy之前执行sh scripts/minify.sh即可

 

性能评测

整个Octopress部署完成之后，我对octopress进行了一个简单的性能测试，使用Apache Benchmark(ab)。

服务器的一些信息是：

• 基本信息：Linode JP 1024
• 操作系统：GNU/Linux Gentoo i686
• 内核版本：2.6.39.1-linode34
• CPU：Intel(R) Xeon(R) CPU L5520 @ 2.27GHz
• 内存：1G

测试命令：

ab -c 128 -n 3200 http://blog.fangjian.me/

 

测试结果：

Server Software:        nginx/1.0.6
Server Hostname:        blog.fangjian.me
Server Port:            80

Document Path:          /
Document Length:        24596 bytes

Concurrency Level:      128
Time taken for tests:   20.244840 seconds
Complete requests:      3200
Failed requests:        0
Write errors:           0
Total transferred:      79652104 bytes
HTML transferred:       78970736 bytes
Requests per second:    158.06 [#/sec] (mean)
Time per request:       809.794 [ms] (mean)
Time per request:       6.327 [ms] (mean, across all concurrent requests)
Transfer rate:          3842.21 [Kbytes/sec] received

Connection Times (ms)
              min  mean[+/-sd] median   max
Connect:      179  204 217.9    190    3191
Processing:   539  589 130.0    573    2653
Waiting:      179  190  14.7    190     792
Total:        718  794 252.2    763    3765

Percentage of the requests served within a certain time (ms)
  50%    763
  66%    776
  75%    778
  80%    785
  90%    799
  95%    810
  98%   1504
  99%   1615
 100%   3765 (longest request)

 

从上面结果可以看到，95%的请求都是在800ms左右就返回了，这是一个很不错的速度了。

同样的我使用Google PageSpeed 进行了测试，网站得分是92分（100分制），对于个人博客来说这个分数已经很不错了。

 

Byword

最后推荐一款Mac下很不错的支持Markdown文本的编辑器——Byword，这个编辑器界面优雅，美观，字体漂亮，而且支持markdown文本预览，是一个很不错的编辑器。

App Store下载地址

 

结语

作为Octopress实验小白鼠，这篇文章实际上是一篇实验报告，经过抉择之后，今后我会一直留在Octopress这个社区中，也许我会做一些 插件和主题什么的，现在Octopress社区还在发展中，希望能有更多的Hacker们加入这个社区，同时也希望我这篇文章能够帮到你。

来源：http://blog.fangjian.me/posts/2011/12/18/migrate-wordpress-to-octopress/