- 先扯淡几句
(1) 为什么要搭建个人博客?
有目标才有去做的动力。这无疑是要解决的第一个问题。
确实,很多情况下是似乎没有必要,耗费精力。特别如果你和我一样是学生,
我觉得多学点知识比什么都好。但是也有有利的一面。比如:
<1> 分享知识,表达思想。有时候分享的过程让你对知识有更深入的理解。当然,
和 openSUSE 有关的分享建议贴 wiki 和 论坛:),有个公开的平台也可以督促
自己(这个因人而异)。
<2> 自身的宣传平台。在《如何成为一名插画师》这本非常著名的小册子中作者
提出一个非常重要的观点。要趁早的宣传自己。无疑个人网站是一个很好的平台,
日后可以作为是一份很好的简历。作者也确实这样说了,早点建立自己的网站,展示自己
的作品,不要放过各种的机会。当然,从事其他行业也可以通过个人网站来宣传自己。
<3> 学习一些网站的知识。有志成为一个 web 程序员的新手或者业余爱好者,
这无疑是一个实践的好机会。门槛非常低。可以为以后自己做更加专业的网站打
打基础。
<4> 当然,很重要的一点,有个个人博客是很拉风的,比你 QQ 空间买个黄钻什
么的一定是拉风的多。
(2)为什么要用 github + jekyll?
从某种程度上来说,弥补了耗费精力这点不足。用 github + jekll 搭建的环境
非常省心。更重要的一点,不仅省心而且省钱,这个不用花钱。以我个人来说,
作为一个穷苦的学生党,花几百RMB,建一个月访问量可能只有个位数的网站,
不如把钱捐个社区。当然你们省下的钱也可以捐给社区:)
(3)为什么要写这样的教程?
说实话,关于 github + jekyll 的教程可以在网上找到很多(讲一些内容的时
候我可能就直接引用了)。为什么要写这篇。因为没有(我没有发现)在
openSUSE 下操作非常小白的从注册 github 到生成可以访问网页一条龙的教程。
所以我觉得可以写写。希望对大家有帮助。
好了,下面开始。
2.正式的教程
(0)基础
当然你要有一台可以上网的电脑装的系统最好的openSUSE:),不需要会 git,学会本文
讲到的几个命令就好了。不用会 ruby。甚至你不需要会用 zypper,因为我会把
命令贴给你(当然这个你还是会的好)。需要先学会本文不会讲到的就是你要会用
markdown,这个非常好学的。半个小时绰绰有余。当然你要会用 html也可以。
你需要安装 git,ruby,ruby-devel。通过 zypper 非常方便就安装了。
sudo zypper in git ruby ruby-devel
(1)创建 github 帐号
建立帐号前先配置一下你的 git。很简单,就是你的名字和邮箱。
然后创建一个 github 的帐号。这个 so easy。登陆 github 网站。(一个帖子不能有太多链接,这个大家找得到的吧?google github 一般
就是第一个)
进去以后注册邮箱验证什么的,和注册论坛没有什么区别。然后比较关键的一步。
github 添加远程仓库。你需要使用 SSH Key,这个可以让你访问远程仓库方便
一点。你总不希望每次提交都要输入密码吧,而且我发现有时候输入密码也会推
送失败。不如用 SSH 来登陆。直接贴一份 图文并茂的教程](远程仓库 - 廖雪峰的官方网站) 。
只要看我上面贴的这章就可以了。十分钟看完搞定。
(2)建立博客并测试
如果你愿意可以看看这篇 非常短的 git 教程](git - the simple guide - no deep shit!) 有个印象也好。不
乐意也没有关系。我们日常用到三个命令就可以了。
git add --all
git commit -m "提交的说明"
这两个命令可以合起来理解就是把你的修改添加到 git 仓库。
git push
提交,这里其实就是发布你的网页
现在让我们开始建立我们的博客了。继续贴传送门。 githubpag
不怕,虽然是英语你看图也应可以懂,这点内容你每个单词查也花不了多少时间
。唯一需要注意的一点是,不要按照上面的教程直接
git clone https://github.com/username/username.github.io
这样你上传的时候会非常麻烦。因为我们已经弄好了 SSH key,所以改成使用 ssh clone 而不
要用 https,这个 SSH 的链接可以在你的 github 上轻松找到。他看上去是这
样的
git@github.com:username/username.github.io
按照上面的内容你应该有了一个写着”Hello World“字样的博客主页了。
你可以通过浏览器在任何时间任何地点访问他。
(3)本地安装 jekyll 并创建真正的网页
为什么要用 jekyll?什么是 jekyll?
你可以这样理解。他就是这样一种东西。你可以用非常方便的方法(比如
markdown)写好文章的内容,然后丢给 jekyll,然后 jekyll 就会帮助你转换
成网页上的东西。
实际上你并不一定要在本地安装 jekyll。你只要按照 jekyll 的规范用任何编
辑器写好东东,然后丢到刚才你建立的仓库中去就可以了。github 会用 jekyll
处理成你可以访问的网页。
但是在本地有 jekyll 这样有几个优点:
<1> 手动创建会很麻烦,jekyll 是可以自动生成符合要求的目录结构的和一些默认的配置文件。
<2> 有了 jekyll 可以本地测试生成的网页。你总不会希望发布了才发现其实你
写的东西是一堆乱码吧。
我们现在来安装 jekyll,首先我们需要安装 ruby 和 ruby-devel。注意一
定要安装 ruby-devel。不然无法通过 gem 安装 jekyll。我发现即使你在 YaST
安装了 Ruby 开发环境,ruby-devel 也不会被自动安装。所以务必要安装好
ruby-devel。
安装玩 ruby-devel 以后要我们还要干一件事情就是换 ruby 的源。默认的实在
是太慢了。我们换成淘宝的源下面的操作你复制粘贴就看可以了。
sudo gem sources -a ruby.taobao.org/
sudo gem sources --remove rubygems.org/
操作完了你可以运行 gem sources -l 看看是不是改好了。改好了他的输出应该
是这样。
*** CURRENT SOURCES ***
http://ruby.taobao.org
确保只有一个源地址。
然后安装 jekyll。这个很简单。
sudo gem install jekyll
还记得上面你看 clone 下来的网页,里面只有一个写着 “hello world” index.html?
现在删掉这个 index.html,保持这个目录是空的(隐藏文件保留不用管它)。使用
jekyll2.0 new username.github.io
来创建我们的目录。
(username.github.io 的名字太难记了。你可以改一个自己喜欢的名字。这个没
有关系。比如 blog-jekyll。那样你就运行
jekyll2.0 new blolg-jekyll
)
对的,你没有看错,用的就是 jekyll2.0。是没有 jekyll 这个命令的。当然你
可以建立一个链接把 jekyll2.0 链接到 jekyll。不过也没有必要。你在终端输入 jekyll 然后俺 tab 补全
就可以了。其实你只要输入 je 就可以按 tab 补全了。
现在你的 blolg-jekyll 文件夹里面会有很多的文件和文件夹他的目录应该是这
样的:
|-_config.yml
|- index.html
\css
|-main.css
|-syntax.css
\_layouts
|-default.html
|-post.html
\_posts
|-*.markdown
现在你要做的事情非常简单。只要去 _posts 目录下创建一个 markdown 文件就
可以了。这里假定你已经会了 mardown。你只要把文章用 markdown 格式写好
放到 _posts 文件里就好了。有几点要注意的。你的 markdown 文件开头需要包
含类似这样的内容。
---
layout: post
title: xxxxxx
---
当然还可以自定义很多东西。那个 layout 就是样式,名字就是_layout 文件夹里存在的样式文件的名字,
title 就是文章的标题。还要注意你的 markdown 文件名必须是 YYYY-MM-DD-文章名.markdown。就是日
期+文章名这种格式。
这样写好你只要用我说过你必须记住的三个 git 命令就可以了
git add --all
git commit -m "提交信息"
git push
就可以了,等上十分钟,你就以在网页上看到你写的内容了。
但是且慢。万一你写错了怎么?当然我们需要本地测试看看结果了。我们可以在
jekyll 目录下这样做。
jekyll2.0 build
构建网页
jekyll2.0 serve
这个时候你会开启一个本地服务。你看到的输出大概是这样的。
根据提示,你可以通过浏览器访问这个地址 0.0.0.0:4000/ 来本地查看
你写的内容。
话说 jekyll 这点非常人性化,就是他会吧本地的生成的文件(_site 里的东东,
你 build 以后会看见这个目录)自动添加到.gitingore 里。不会添加到远程仓
库。
(4)你可能需要继续学习的内容
<1> 更多的 jekyll 的知识](http://jekyllcn.com/) 和更多 git 的知识 ,你也许要定制更加个性的网页。添加新的功能比如
添加图片
<2> html 和 css 的知识。可以让你的网页更加漂亮。w3school 是个很好的去
处。免费学习一些网络知识。
<3> 美工知识,这个就靠积累了。一些色彩排版的常识。
<4> 写作知识。其实我觉得这个才是最重要的。清晰的表达自己的思想。