在github上用orgmode与jekyll整合静态博客

来源：admin 更新： 2012-08-09 19:34 分类：网络技术标签：orgmode 源文件

如果你比较熟悉jeklly和orgmode，其实最简单的在github上用orgmode与jekyll整合静态博客就是：org 导出html，直接交给 jekyll 处理。

orgmode与jekyll整合静态博客目前已有的解决方案

你可以安装 o-blog.
使用一个CGI脚本生成
使用php脚本生成

什么是静态博客

静态博客顾名思义就是静态网页组成的博客。与之对比的动态博客，也就是页面是动态生成的，博客内容依存于数据库，国内各大网站提供的博客系统大都是动态博客。静态博客的页面可以是手工通过制作html页面来维护，这样的话博客最基本的按日期管理、文章分类等特征都得手工完成，这么笨拙的办法可能没人喜欢。于是现在多是使用辅助工具帮助生成整个博客站点，文章自动按照日期管理、有类别或者TAG分类、还融合了留言板等其他技术，jeklly就是其中一员。

什么是jeklly

jekyll 可以把以日期为文件名的 markdown 格式的文本文件转换为html的静态博客。

Jekyll is a simple, blog aware, static site generator. It takes a template directory (representing the raw form of a website), runs it through Textile or Markdown and Liquid converters, and spits out a complete, static website suitable for serving with Apache or your favorite web server.

可以理解为jekyll是实际转化生成静态站点的脚本程序，而octopress是套在jekyll外的一层封装，使得最终生成的站点上有更好的UI，更有风格，并且有更丰富的辅助功能（留言、代码展示、视频）。

生成和更新服务器的命令大致如下,每次写完内容后要做的操作：

生成＆更新博客的命令

rake generate   #将source目录下的markdown文本生产为public目录下的blog
rake preview    #本地预览 localhost:4000
rake deploy     #根据public目录生成_deploy目录并上传github 
#上边的操作已经更新了网站服务器，以下是保存代码改动到github服务器的其他branch               
git add .
git commit -m "comments"
git push

什么是emacs org-mode

emacs 是一个拥有强大扩展能力的文本编辑器，扩展能力强大到可以浏览网页、发微博、调试程序、管理日程，总之什么都可以做。嗨网本人并不是一个all-in-emacs控，嗨网不会用emacs做发微博这类的事情，但是还是很喜欢用它工作。它有几个特点吸引嗨网：

免费。
丰富的辅助开发功能，比如和SVN，GIT的融合，编译make的融合。
快捷键便利。
不断在更新，比如现在对多国语言的支持越来越好。
全球范围内强大的技术支持，网上资源很多。

emacs 启动界面既然emacs这么好，如果熟悉它的话，自然写博客的时候也想用它了。单纯用emacs来写markdown格式的文本固然也可以，也有相应的emacs模式配合。但是寡人不熟悉markdown格式，相反对同类型的功能更强大的org-mode略知一二，所以就想用org格式来写博客。

org-mode 是emacs的一种扩展模式，是在 outline mode 基础上发展出来的一种文本编辑辅助模式。适合在编写大纲（outline）组织结构的文档时使用。orgmode拥有丰富的快捷键由于编辑文档，支持url link，有强大的TODO、Agenda功能用于组织计划、有方便的表格功能、可以快捷的将org文档导出成html、pdf、laTex等格式的文档。

这里重点说一下org模式下的html导出功能。org模式可以通过配置，将指定文件夹下的所有org文件导出到一个指定文件夹内（包括子文件的层级关系），org文件之间的link也会转化为html的link，因此直接使用这个功能就可以很方便的用org模式维护一个简单的静态网站。

org模式publish配置示例

(setq org-publish-project-alist
      '(("note-org"
         :base-directory "~/org/"
         :publishing-directory "~/pub/"
         :base-extension "org"
         :recursive t
         :publishing-function org-publish-org-to-html
     :headline-levels 3
    :html-extension "html"
     :table-of-contents t
     :link-home "/index.html"
     :section-numbers t
     :style "<link rel=\"stylesheet\" href=\"/org.css\" type=\"text/css\"/>"
     )

        ("note-static"
         :base-directory "~/org/"
         :publishing-directory "~/pub/"
         :recursive t
         :base-extension "css\\|js\\|bmp\\|png\\|jpg\\|gif\\|pdf\\|mp3\\|swf\\|zip\\|gz\\|txt\\|el\\|pl\\|mht\\|log\\|bin_\\|bat\\|tst\\|doc\\|docx\\|gz"
        :publishing-function org-publish-attachment
     )
        ("note" 
        :components ("note-org" "note-static")
        :author "[email protected]"
        )))

通过上边的设置嗨网只需要一个快捷键就可以将 ~/org/ 下的org文件全部导成 html 存在 ~/pub 下。

org子文件层级关系保留可以为导出的html指定css格式 org文件夹内的其他格式的文件，如图片也可以设置一并导入pub目录可以自动生成org文件内的目录（TOC）

如何在github上用orgmode与jekyll整合静态博客

终于到了org与jekyll整合的部分了。关于整合 orgmode 和 octopress（jekyll），可以找到几种方式：

org 导出html，直接交给 jekyll 处理。这么做有个问题，org生成的html可能和 markdown 产生的html有差异，有的时候兼容性不好。比如，插入语句时，由于 org 生成的 html 充满了 div ，导致在有 headline 的情况下页面可能会乱掉。
org 文件通过 emacs 的插件转换为 markdown 格式，再由 jekyll 处理。可以到这里找到相关资源。
org-ruby。通过Ruby将 org 文件转化为 html，而不是通过emacs。

目录结构

以下是嗨网现有的目录结构供参考

+ blog               # 博客根目录
   + org             # org文件根目录
  + _post
   + source          # org导出根目录，也是octopress本身用于生成blog的根目录
      + _post        # markdown或者org导出的html存在这里
      + _include     # 这里是一些octopress的UI template文件
      + _layouts     # 这里也是
      + rc           # 我的照片等资源的文件夹
      + video        # 我的视频文件夹
      + ...
   + public          # 通过命令 source下的内容会自动导出到 该目录，包括自定义的 rc、video
      + blog         # 内部的子文件按年月日排列
      + rc
      + video
      + ...
   + _deploy         #通过部署命令生产，为了更新github而产生
      + ...

emacs 设定

以下.emacs文件的设置有几个要点：

jekyll 本身针对 markdown 转化设计，但实际也支持html。但是org模式导出html时要设置为 body-only ，只导出html的body的部分，页面head和footer的内容由 jekyll 生成。最好不要导出目录（TOC）。 base和publishing目录的设置虽然设置了资源文件的导出，但是嗨网目前实际没有使用，而是直接把图片等资源文件放到 source/rc/ 下。

(setq org-publish-project-alist
     '(("blog-org"
     :base-directory "~/blog/org/"
     :publishing-directory "~/blog/source/"
     :base-extension "org"
     :recursive t
     :publishing-function org-publish-org-to-html
 :headline-levels 4
 :html-extension "html"
 :body-only t ;; Only export section between <body> </body>
 :table-of-contents nil
 )

    ("blog-static"
     :base-directory "~/blog/org/"
     :publishing-directory "~/blog/source/"
     :recursive t
     :base-extension "css\\|js\\|bmp\\|png\\|jpg\\|gif\\|pdf\\|mp3\\|swf\\|zip\\|gz\\|txt\\|el\\|pl\\|mht\\|log\\|bin_\\|bat\\|tst\\|doc\\|docx\\|gz"
     :publishing-function org-publish-attachment
 )
    ("blog" 
     :components ("blog-org" "blog-static")
     :author "嗨网"
     )))

操作

假如今天要写这篇新的博客，大致过程如下：

用emacs创建 blog/org/_post/2012-08-11-org-octopress.org 这个文件。(日期的部分设置了快捷键直接添加) 在文件的头部加入如下内容：(这部分可以通过 YASnippet 加速添加)

#+BEGIN_HTML
————
layout: post
title: emacs + org-mode + octopress + github
categories: [binary, orgmode, octopress]
comments: true
————
ORG-LIST-END-MARKER

用org模式写博客的内容。
用 org-publish 命令导出这个org文件。
rake generate 生成博客
rake preview 可以本地先检查下
rake deploy 部署到服务器

如果你不熟悉命令行，或者觉得这种方式写博客过于繁琐，那可能并不适合你。但是如果你熟悉命令行或者脚本，可以给你写博客带来不一样的感受。比如要添加很多图片到一篇博客，可以用脚本便利目录下的所有图片自动生产相应的语句，或者做更酷的事情。