本站是如何搭建的

Table of Contents

本文介绍如何使用 Org mode 来搭建本站(wiki)。本文适合喜欢折腾的同学们,如果你已经是懒人一个,那么使用wordpress搭建博客更加方便。而如果同时你喜欢Emacs+orgmode的写作方式, org2blog 插件也能与 wordpress很好的结合。

那么下面开始正题吧。

需要的工具

“工欲善其事,必先利其器”,这里我们使用的就是Emacs+org的写作方式,再利用它直接生成HTML,最后再将其发布在网上(或是用于本地浏览)。

以下是你需要的工具:

  1. Emacs ── “万恶”之源,当然是必备的。
  2. Org mode ─ ─Emacs的强力插件,据说有不少人使用Emacs完全就是为了用它。需要注意的是,请使用最新的版本,而不是Emacs自带的版本。
  3. htmlize ──Emacs插件,用于将文本转换成HTML,支持代码高亮。
  4. 熟悉Emacs的操作,会用Org mode,能看懂emacs的配置。

设置 org 工程

本文不会面面俱到地说明如何从零开始,只是提供一个思路,讲解一些关键点,重要的还是多看多折腾。

工程结构

本文中,我们首先创建两个目录 ~/Dropbox/org/orgwiki 用来存放源文件;以及 ~/Dropbox/org/orgwiki_html 用来存放生成的HTML文件。目录结构示例如下:

/home/zhangjinzhou/Dropbox/org/orgwiki/
|-- assets
|   |-- css
|   |   |-- style.css
|   `-- js
|       `-- jquery-1.7.1.min.js
|-- files
|   `-- org-projects.el
|-- images
|   `-- test.jpg
|-- index.org
|-- postamble.html
|-- preamble.html
|-- publish_wiki.sh
`-- sitemap.org

其中, assets 是用来存放网站模板所需要的文件, filesimages 视你自己的需要而定,是用来存放文章中用得着的文件。

1中,作者详细介绍了如何使用Org mode 来建立工程以及模板的基本使用方法,请详细阅读。

工程设置

由于1中的设置只能对输出的一些选项做基本的配置,不能完全满足楼主的需求,于是,根据worg 官网 的设置2做了一些调整。

完整的设置请参见 files/org-projects.el, 本wiki的源码可以在 Github 上得到。

设置包括两个方面,第一个方面是控制Emacs如何输出HTML,这需要在 .emacs 里设置,也就是files/org-projects.el 里的这些内容。另一方面是控制输出的HTML如何显示,这也是之前提到的“模板”。

本wiki的模板主要包括4个文件,需要注意的是,这个模板是与Emacs的设置对应的。

/home/zhangjinzhou/Dropbox/org/orgwiki/
|-- assets
|   |-- css
|   |   |-- style.css
|   `-- js
|       `-- jquery-1.7.1.min.js
|-- postamble.html
`-- preamble.html

其中, preamble.html 中包含了导航相关的信息。 postamble.html 中添加了诸如评论等的一些功能。如果你需要使用我的模板,请注意替换这两个文件中的相应内容。

其中, org-projects.el 的设置有两种用法(for 小白们),第一种,将它放在某个目录下,如: ~/.emacs.d/elisp 下。再在 .emacs 中加入下面代码:

(add-to-list 'load-path "~/.emacs.d/elisp")
(require 'org-projects)

或者将里面的所有内容全部复制到 .emacs 文件中。

其它设置

由于我的模板里有一个功能,是显示文章对应的原始orgmode文件。对于 orgmode 里的链接,原本的样式会丢失,是因为在orgmode 显示时, [[link]] 变成了 link ,因此输出时丢失了外面的括号。因此在 .emacs 加入下面代码:

; Enable literal links 
(defun turn-on-literal-links ()
  "enable literal links."
  (interactive)
  (org-remove-from-invisibility-spec '(org-link))
  (org-restart-font-lock))

(add-hook 'org-mode-hook 'turn-on-literal-links)

Footnotes:

Back to Top