Modify Octopress Blog

这几天一直在捣鼓blog.因为很久没有用Octopress写blog.另外也没有碰HTML相关。所以写markdown或者改Octopress都手生。这里把各种修改方法一一记下。要学习的是ruby, Liquid.

0.开始学习

学习ruby推荐以下这几个网站：

• ruby doc

• ruby中文的官方文档

• ruby 在线运行环境 使用这个可以在线运行ruby. 查看执行结果。对于机器没有装ruby,这个是极好的平台。

然后是学习Liquid. Liquid这个本身是用ruby写的。所以只需要会用就行了。语法很像JSP.

YAML. 这个全称是’YAML Ain’t Markup Language。'。定义看起来和GNU很想。这个鬼东西不希望采用XML的方式。基本是做配置文件使用的。如果想细细学习。猛击这里。在Octopress中基本上也就是定义了一下全局的某些量的true,false.其他基本上没有用。

1. 开始修改Octopress blog

1.1 Octopress 简单介绍

Octopress. 这个是继承了Liquid.然后加了一些plugins.最主要的plugin是plugins/octopress_filters.rb. Octopress的工作原理就是使用Liquid对各种文档进行渲染生成html. 只不过比原始的Liquid的功能更多。另外使用Rake对各种命令打包。Octopress最重要的几个目录是: source, plugin. Octopress会先进行渲染，然后将渲染后的文件放入到public目录中，之后再将public目录中的文件移动到_deploy目录下。然后通过git上传_deploy目录完成发布。所以如果你想加入什么自己新写的html不要放到public或者_deploy目录下。要放在source目录完成发布。所以如果你想加入什么自己新写的html不要放到public或者_deploy目录下。要放在source目录下。比如我为自己的blog自定义了一个404.html.那么就要放入到source目录下。或者放入其他目录下并且改写Rakefile, 改写multitask :push中的命令。

1.2 Octopress source的文件目录结构。

• 首先是_posts这个目录。这个是用来存放你用markdown写的blog的。使用rake new_post[‘xxxx’] 就可有创建一篇名为xxxx.markdown的文件。

• _includes这个目录。这个目录是引用各种模板html的。例如我的jiathis脚本和google ads脚本.我个人一般会将这些第三方存放在_includes/post目录下。引用的时候使用

{% include post/xxx.html %}

如果是在_include下的article.html,引用则为

{% include article.html %}

其中最重要的是article.html文件。这个每篇文章的显示。并且对于首页和具体blog都是引用的article.html. article.html中有 {% if index %}，如果index为true,则是首页。

• _layouts这个目录，这个目录是对应着每篇文章的样式(当点进某篇文章后，这个目录下的文件就开始其作用)。其中最重要是post.html这个文件。修改也主要是修改这个。

• index.html. 这个就是首页了。页面的排版都在这里。

2. 实战

2.1 jiathis 添加

下面以jiathis的添加为例。

加入jiathis需要修改以下这些文件：

• 添加 source/_include/post/jiathis.html （不用照抄，直接在jiathis.com中找找同样的html即可。）

• source/_include/article.html 修改为：

图中修改的位置是点击到详细页面后，jiathis出现。如果希望在首页就出现，一种可以修改 else之前的，或者直接修改source/index.html文件

2.2 修改侧边栏

如果你的blog有侧边栏的需求的话。那么需要改两个地方：一个是post.html,另外一个是index.html. Octopress的页面控制基本就是由这两个文件组成。index.html是控制首页。而post.html是控制详细页。

• source/_layouts/post.html 修改最下方，例如下图(不要照抄)：

• source/index.html 也是修改最下方。

4. 添加404页面。

github上的404页面可以定制。只需要在index.html那个目录中加入一个404.html即可。例如我的：

3. 总结

之前觉得这个Octopress很cool,后来才发现上了贼船。这东西定制起来还是比较费劲。另外最费劲的就是Octopress升级。下一章讲如何升级。不过还是劝大家暂时不要升级，下个版本感觉不稳定，有很多诡异的问题产生，而且它的兼容性也没有做好。还有就是在markdown里写Liquid脚本。这才是个渣。因为有时候希望这些脚本被显示的展示给用户，那么就需要将这些脚本转为16进制，否则Liquid就会解析该代码。所以用16进制写{%%}，或者直接使用截图的方法。另外Octopress的双引号解析更渣，都解析反了…所以推荐使用单引号。