用Octopress免费静态博客系统在Github免费空间上搭建个人网站

免费建站 2012年11月09日 16:55

文章目录

安装必要软件
安装博客系统
更改环境变量
提交到Github
发布新建页面
建站演示小结

Octopress是一款优秀的静态化博客系统，也是一个本地化的博客系统，之前部落在介绍免费开源Github Pages空间时有提到过Octopress，Github为我们提供长期稳定的免费空间服务，但是Github空间不是一般意义上的PHP或者ASP空间。

Github是一个代码托管空间，我们常用的一些PHP应用程序都无法在Github空间上运行。Octopress作为一个本地化的博客，官方将它简称为：“A blogging framework for hackers.”，也就是Octopress只适合那些经常玩Linux、写代码的朋友用的博客系统。

使用Octopress博客最大的优势就是静态化，不依赖脚本程序，没有MysqL等数据库，因此它可以在一些性能差的服务器或者虚拟空间上运行，在同等条件下打开页面的速度自然也是非常快。

Octopress支持自定义模板，可以markdown，文本文件写作、保存可以直接用dropbox等网盘来同步。另外它还可以让你有git版本控制功能。octopress还有个优点就是它的整个使用/发布是个松耦合的结构，相信一些习惯了代码的朋友很喜欢。

说到免费建站，Wordpress无疑是大多数非常Coder朋友的选择，WP既可以满足你折腾的需要，也可以满足你轻松建站的需要：

1、本地搭建WP：Windows系统wordpress本地测试准备安装XAMPP
2、本地服务器：USBWebserver本地快速搭建Web服务器环境一键式服务器平台
3、WP整合折腾：WordPress整合Discuz! X2.5、Anwsion问答统一用户同步登录

用Octopress免费静态博客系统在Github免费空间上搭建个人网站

一、安装Octopress运行的必要软件

1、Octopress官网及软件下载：

1、官方首页：https://octopress.org
2、这里是RubyInstaller下载地址。
3、这里是DevKit下载地址。

2、这是安装RubyInstaller时的界面。

3、这是安装DevKit的界面，直接解压放在一个文件目录中。

4、启动Ruby命令框，用CD的命令进入你存放DevKit的目录中，执行以下命令继续安装。


ruby dk.rb init
ruby dk.rb install

5、你可以在你的存放软件目录中看到相关文件配置。

二、在本地安装Octopress博客系统

1、要安装Octopress，就得先改变一个软件更新的源，因为默认的官方下载源已经被Q了。执行以下命令。


gem sources -a https://ruby.taobao.org/
gem sources -r https://rubygems.org/
gem sources -l

2、然后执行：vi Gemfile 编辑配置文件，你也可以直接使用文本编辑器打开Gemfile，将第一行的source改成国内淘宝的。

3、依次进入你存放博客的目录中，安装bundler。


gem install bundler
bundle install

4、再安装Octopress默认的主题。


rake install

5、最后是生成和预览博客。


rake generate
rake preview

6、用的浏览器打开：https://localhost:4000/，就可以看到Octopress博客效果了。

三、更改电脑环境变量让Octopress支持中文

1、上面我们已经将Octopress安装在自己的电脑上了，但是如果你直接生成有中文的文章时是不会成功的。

2、我们需要改变一下我们计算机的环境变量，计算机–属性–高级系统设置–环境变量。

3、新增 LANG 和 LC_ALL ，值都是 zh_CN.UTF-8。

4、确定后保存。

四、提交Octopress博客到Github免费空间

1、刚刚我们已经在本地生成了Octopress博客，现在我们要将Octopress博客提交到Github免费空间上。

2、先进入你的Github的本地项目中。

3、连接Github服务器，填写你的Responsibility Url。

4、然后再执行生成和提交命令。


rake setup_github_pages
rake generate
rake deploy

5、完成后，当你再打开你的Github的二级域名后就可以看到刚刚提交的Octopress博客了。

6、除了上面使用Ruby来提交外，你还可以直接使用Git来提交你的Octopress博客。

7、执行Octopress生成后，博客所有文件都存在一个Public的文件夹。

8、你只要将这个Public中的文件复制或者直接上传到你的Github的空间也能实现浏览的效果。

五、Octopress博客发布文章和新建页面

1、发布一个文章前，先生成一个MD的文件，执行。


rake new_post["nihao my friends"]

2、它会在项目/source/_posts/中生成一个MD文件，类似2012-11-04-nihao-myfriends.markdown这样的。

3、如果想要新建一个页面，则可以执行。


rake new_page["about"]

4、Octopress需要使用markdown语法，并不是常用的HtmL，你可能还要学习一下：https://wowubuntu.com/markdown/

5、文章编辑完成后，就是生成和发布了。


rake generate;rake deploy

6、本地预览可以用以下命令。


rake preview

7、退出预览是：


Ctrl+C

六、Octopress建站演示和小结

1、这里我用Octopress在Github空间搭建的博客：

1、主页演示：https://freehao123.github.com/

2、注意：Octopress博客其实可以发布在任何空间上，不一定是Github，例如我们平常用的SourceForge空间等都是可以的。

3、本文只是简单地介绍了一下Octopress生成发布文章，更多的如Octopress博客设置、域名绑定、模板制作等都会在下一篇建站中讲到。

您或许对下面这些文章有兴趣: 本月吐槽辛苦排行榜

免费资源部落博主

经常混迹于各种免费资源中，尝鲜后乐于分享给他人。用WP搭建了部落博客，没事儿就折腾Wordpress，喜欢找免费空间，但只求精，稳定，耐用。有时也会介绍一点关于建站的知识和主机、服务器的使用心得与体会。

TA的专栏：qi | qi 的博客 | 我要投稿

关于本文的作者

本文标签：Github空间, Octopress

所属分类：免费建站

链接地址：https://www.freehao123.com/octopress/

浏览前页：GitCafe国内在线托管软件项目平台申请试用:附与Github简单比较

浏览后页：又拍图片管家国内高速的外链相册服务100MB容量1GB外链流量

在这个部落村庄里，已经有66 位神马家族成员冒出泡来在农场开始干活了

xiongliang 4

这个博客好玩不？

[回复]
qi 回复:
@xiongliang, 没有Wordpress好玩，而且写文章不是很方便。

[回复]
这是农场的第 1 块农田，部落批准 [xiongliang] 在[2012-11-9 17:21]开垦完成.
mfqj 8

静态的就不折腾啦！

[回复]
这是农场的第 2 块农田，部落批准 [mfqj] 在[2012-11-9 17:36]开垦完成.
exexue 神

大哥。回复我啊。我买了hostso空间了。大哥。你也不回复我。不然我貌似买那个5美元的vps。大哥hostso空间支持*么？我貌似不知道怎么设置。

[回复]
qi 回复:
@exexue, 在QQ回复你？你给我留言了吗？我刚刚忙完回来，这几天的留言都没有看，现在一一回复中。Hostso的Cpanel面板可以设置%，你有成功试过没？

[回复]
oyoy 回复:
@qi, 这个%我也没有用成功过…囧…Hostso今天中午开始抽风，后台进不去，要不是我生成了静态文件+国内缓存，前台也差点倒闭了。

[回复]
exexue 回复:
@qi, 我第一次打开cpanel面包。他提示让我设置*密匙要的。设好了。以后。我也不知道连接那个域名或者ip。我看了他们上面提示的那个视频教程。貌似绑定了的域名就可以进行连接。但是我连接的时候。提示失败。无法连接啊。大哥。怎么办？大哥研究下吧。

[回复]
qi 回复:
@exexue, 我测试了一下，也没有成功。

[回复]
这是农场的第 3 块农田，部落批准 [exexue] 在[2012-11-9 17:38]开垦完成.
Aoyu 6

这个不错，貌似有人用github弄过

[回复]
qi 回复:
@Aoyu, github的代码更新我还一直有点不明白，老在更新代码出现错误。

[回复]
这是农场的第 4 块农田，部落批准 [Aoyu] 在[2012-11-9 17:54]开垦完成.
哼哼猪 12

不使用数据库也有一定的好处

[回复]
这是农场的第 5 块农田，部落批准 [哼哼猪] 在[2012-11-9 19:16]开垦完成.
babytomas 神

不使用数据库可以加大安全性是吗？

[回复]
qi 回复:
@babytomas, 是的，这样少了数据库渗透了。

[回复]
这是农场的第 6 块农田，部落批准 [babytomas] 在[2012-11-9 19:46]开垦完成.
babytomas 神

为什么我变成了“LV2”。。。。

[回复]
qi 回复:
@babytomas, 有什么不对劲吗？

[回复]
babytomas 回复:
@qi, 、之前貌似很高的啊 ….怎么瞬间变成小白了

[回复]
qi 回复:
@babytomas, 原来我的CSS出了问题，我修改了CSS。你的LV居然达到了12，是目前最高的。你看看还有什么不对劲的吗？

[回复]
babytomas 回复:
@qi, ，木有问题木有问题~~这样就对劲了~

[回复]
这是农场的第 7 块农田，部落批准 [babytomas] 在[2012-11-9 19:47]开垦完成.
jisaopo 1

很好的教程，学习了

[回复]
这是农场的第 8 块农田，部落批准 [jisaopo] 在[2012-11-9 20:20]开垦完成.
oyoy 20

看起来难度颇大，但是感觉挺适合Hostso这种主机

[回复]
这是农场的第 9 块农田，部落批准 [oyoy] 在[2012-11-9 21:32]开垦完成.
peascloud 16

真麻烦。

[回复]
这是农场的第 10 块农田，部落批准 [peascloud] 在[2012-11-9 22:03]开垦完成.
wengshijie 21

我讨厌写代码。。。这东西只适合程序猿嘛

[回复]
这是农场的第 11 块农田，部落批准 [wengshijie] 在[2012-11-10 09:11]开垦完成.
wengshijie 21

怎么等级没有了

[回复]
qi 回复:
@wengshijie, 你看不到吗？我这里看到你这是lv9。。。

[回复]
wengshijie 回复:
@qi, 现在才有

[回复]
这是农场的第 12 块农田，部落批准 [wengshijie] 在[2012-11-10 09:13]开垦完成.
胡倡萌 5

最近这个有点火，看到不少能人都折腾了

[回复]
这是农场的第 13 块农田，部落批准 [胡倡萌] 在[2012-11-10 10:25]开垦完成.
飘零 6

是哦，速度还不错哦

[回复]
这是农场的第 14 块农田，部落批准 [飘零] 在[2012-11-10 11:26]开垦完成.
NoAnyLove 3

感觉好像就是一个Ruby写的网页生成工具，根据要求和模板申城静态的HTML，然后再用Git提交给GitHub的静态空间。如果做成GUI界面的话应该还是蛮好用的。

[回复]
这是农场的第 15 块农田，部落批准 [NoAnyLove] 在[2012-11-10 12:42]开垦完成.
南寻 12

打开速度很快呢~

[回复]
这是农场的第 16 块农田，部落批准 [南寻] 在[2012-11-10 15:55]开垦完成.
keke 9

这么多代码看着有点烦

[回复]
这是农场的第 17 块农田，部落批准 [keke] 在[2012-11-10 19:25]开垦完成.
ss_ss 13

其实也就说这个Octopress在只要支持PHP的空间上就能运行了，这点还是挺吸引人的。。

[回复]
这是农场的第 18 块农田，部落批准 [ss_ss] 在[2012-11-10 23:31]开垦完成.
丽丽建站论坛 2

呵呵这个挺好的但是代码太多懒得看呵呵，顺便问一下怎么才能有原创内容呢我的网站怎么写都写不出来啊

[回复]
这是农场的第 19 块农田，部落批准 [丽丽建站论坛] 在[2012-11-11 01:02]开垦完成.
wstchql 1

求教https://blog.omobox.com/这个blog是怎么弄得，据说也是纯静态的，眼馋中~~但不会弄~~请@qi大大研究一下，发篇教程~~谢谢~_~

[回复]
qi 回复:
@wstchql, 这个网站现在打不开了。

[回复]
wstchql 回复:
@qi, 呃~忘说了，要挂daili才行~好像是说这个网站以前讨论过daili的内容，被qiang了~~还有里面有篇文章大致介绍了怎么搭建的网站，但太简略~看不懂~囧~_~
https://blog.omobox.com/2012/02/08/new-home-new-start-2
https://blog.omobox.com/about/

[回复]
qi 回复:
@wstchql, 用d打开的，没有看到模板，是一个白色的页面。

[回复]
wstchql 回复:
@qi, 怪了~我这可以打开啊~用%~
以下引用：
捣鼓了几天，新的Blog终于可以用了。记录一下要点：
reStructuredText
reStructuredText 是一种简单易读的纯文本标记语言，是 Docutils 的一个组件。
reStructuredText to HTML
Docutils本身提供了reStructuredText转换为HTML的方法，也提供了很好的定制方法。
这里用了mitsuhiko大牛的 rstblog 程序生成静态文件。
全部静态文件保存到Dropbox上的一个Public访问权限的目录。
%反向d
写一个简单的程序，读取Dropbox的文件，返回给用户。也完成新旧链接的重定向。
新Blog的优点：高可用 —— 有%和Dropbox的保障，可用率可以达到99.99% ，但是因为域名被关键字过滤，%又遭封杀，所以国内基本不能访问
缺点也很明显：需要安装写Blog的环境，

Blog使用restructured text写的，用了mitsuhiko大牛的生成程序生成静态文件，源码在这： https://github.com/mitsuhiko/rstblog
静态文件存放在Dropbox，写了一个小程序放在%作为反向d，源码在这： https://bitbucket.org/lenmore/#-dropbox

[回复]
这是农场的第 20 块农田，部落批准 [wstchql] 在[2012-11-18 11:39]开垦完成.
张明星

呵呵我想学习制作网站呢、

[回复]
这是农场的第 21 块农田，部落批准 [张明星] 在[2012-11-25 22:51]开垦完成.
张明星

大家好；本人喜欢音乐和写作词曲和剧本；希望认识这样朋友一起交流；网号；ryxtsplgzs588888@qq.com

[回复]
这是农场的第 22 块农田，部落批准 [张明星] 在[2012-11-25 22:54]开垦完成.
baham 3

开始用octopress+github 了

[回复]
这是农场的第 23 块农田，部落批准 [baham] 在[2013-1-10 22:11]开垦完成.
hao 8

评论用“友言”代替

[回复]
这是农场的第 24 块农田，部落批准 [hao] 在[2013-1-25 19:14]开垦完成.
sjc9913 1

为什么没找到myblog呢

[回复]
qi 回复:
@sjc9913, myblog也是放在github上的？

[回复]
sjc9913 回复:
@qi, 不是啊你说的存放博客目录里面还有gemfile 我的没有啊

[回复]
这是农场的第 25 块农田，部落批准 [sjc9913] 在[2013-1-30 11:14]开垦完成.
兲語 2

没有基础按照你的教程折腾了好久没有成功，能介绍一下Github for windows的简单的同步文件的教程吗？
就是删除和上传就行，最好详细点，谢谢了，我的# svn被封了，不知道什么原因，没有上传音乐文件，无奈啊。

[回复]
这是农场的第 26 块农田，部落批准 [兲語] 在[2013-4-2 14:06]开垦完成.
peascloud 16

DevKit 无法安装，奇怪。

[回复]
peascloud 回复:
@peascloud, 终于成功了。还是Railinstaller好用！

[回复]
qi 回复:
@peascloud, 你也搭建了静态博客了？

[回复]
这是农场的第 27 块农田，部落批准 [peascloud] 在[2013-5-11 21:42]开垦完成.
opoo 6

最近自己写了一个静态博客系统 OpooPress，不是Ruby的，是Java做的，和Octopress一样支持CSS3，HTML5，同样支持通过 FTP、%等发布，也可以发布到 GitHub Pages。官网 [url]https://www.opoopress.com/[/url]，效果可看我的博客。

[回复]
qi 回复:
@opoo, 博主是不是还没有发布下载？

[回复]
opoo 回复:
@qi, 是的，还没下载的。正在收拾源代码，整理文档等东西，还需要测试一下，希望近期能完成吧。

[回复]
这是农场的第 28 块农田，部落批准 [opoo] 在[2013-6-30 22:32]开垦完成.
ki11 2

为什么我这没myblog这个文件夹？

[回复]
qi 回复:
@ki11, 这是我自己建立的。

[回复]
这是农场的第 29 块农田，部落批准 [ki11] 在[2013-8-22 16:08]开垦完成.
Lar 2

Qi，试过https://zespia.tw/hexo/吗？我想要搭建在VPS上那该怎么实现呢？

[回复]
qi 回复:
@Lar, 网站都打不开，是什么？

[回复]
Lar 回复:
@qi, 打不开？那应该是搭建在github上被q了吧…搭梯子看看

[回复]
Lar 回复:
@qi, octopress文章一多生成就巨慢，hexo基于nodejs，轻巧速度快…

[回复]
Baham 回复:
@Lar, 功能上呢？完全替代octopress吗？

[回复]
这是农场的第 30 块农田，部落批准 [Lar] 在[2014-1-4 10:19]开垦完成.
马斯

速读很快，赞一个》

[回复]
这是农场的第 31 块农田，部落批准 [马斯] 在[2014-6-27 10:44]开垦完成.
Rich 10

写文章始终没有WordPress方便……

[回复]
这是农场的第 32 块农田，部落批准 [Rich] 在[2014-8-10 18:03]开垦完成.
kd

你好，我想请问一下为什么我rake generate之后public文件夹依旧空的？

$ rake generate
## Set the codepage to 65001 for Windows machines
## Generating Site with Jekyll

[回复]
qi 回复:
@kd, 生成失败了，检查一下有没有其它的报错信息。

[回复]
这是农场的第 33 块农田，部落批准 [kd] 在[2014-8-12 23:01]开垦完成.
北门放羊 6

对比了下几个静态博客，最后还是选用了hexo,感觉这个应该是最简单的。哈哈，push到github了，一个简单的演示https://xianjian10.ml

[回复]
这是农场的第 34 块农田，部落批准 [北门放羊] 在[2014-9-20 15:11]开垦完成.
李世明

我执行完代码之后为什么没有看到myblog目录呢？

[回复]
qi 回复:
@李世明, myblog是我在init时选择的软件目录，你可以自己新建一个。这个软件有些复杂，你可以试试这个一键部署的：https://www.freehao123.com/inkpaper/

[回复]
这是农场的第 35 块农田，部落批准 [李世明] 在[2017-5-22 08:41]开垦完成.
阿飞 1

请问评论是怎么实现的

[回复]
这是农场的第 36 块农田，部落批准 [阿飞] 在[2017-9-20 18:15]开垦完成.