github pages + jekyll 构建静态网站

最新推荐文章于 2024-04-09 09:45:42 发布

ipez

最新推荐文章于 2024-04-09 09:45:42 发布

阅读量1.3k

点赞数 1

本文链接：https://blog.csdn.net/cjl0356/article/details/51062409

版权

本篇主要介绍 github pages + jekyll 构建静态网站的基本步骤。

起因：最近新浪SAE调整收费政策，每日租金最少也要58云豆（0.58元），因为网站处于初建阶段，流量很小，这样就不划算了。所以转向github pages，免费托管，静态的对于目前阶段也已经够用了。虽然网上的教程很多，但是都比较乱，有些很复杂，有些又过于简单。昨天花了一下午时间才搞定，现在把大致流程记录如下，给后来人一个参考。

1. github pages 和 jekyll 简介

git：一种分布式管理技术，进一步了解可以google。
github：一个git实现站点，非常流行。
github pages：github提供的一项服务，用于创建介绍项目的页面，也可用于个人博客，并且目前已支持jekyll，更换主题和使用markdown很方便。
jekyll：一个静态网页生成器，可以将markdown或者textile方便的转化成html文件。

2. git安装，github注册及jekyll模版fork

git在window下安装，可以参考
http://jingyan.baidu.com/article/90895e0fb3495f64ed6b0b50.html；
登录https://github.com/完成注册，下面是完成后的样子；
进入https://github.com/hankquinlan/hankquinlan.github.io；
fork一个简单的jekyll模版，点击红框内的fork；

然后你可以在自己的仓库看到
修改项目名称为 username.github.io
username为你github注册用户名，比如我就是ipez。
将jekyll模版pull到本地进行修改，复制红框内的地址
鼠标右键打开 git bash，键入git clone 上面拷贝的地址
完成后，打开文件夹可以进行相关修改

3. jekyll文件结构及相关修改操作

jekyll相关文件结构的介绍，可以看http://jekyllcn.com/docs/structure/
简单介绍一下，
1. _posts 存放所有的博客，可以采用markdown语法书写，文件名必须是year-month-date-title；内部要写文件头，两行 - - - 标识，具体参见http://jekyllcn.com/docs/frontmatter/，另外可以通过categories添加分类；如果文章较多，此文件夹下可以创建子文件夹，只要命名正确，对于jekyll的遍历不影响。
2. 页面的创建可以通过在根目录下新建子文件夹（如上述模版中的CV，blog），然后在文件夹下创建index.html，除了模版，还可以参考http://jekyllcn.com/docs/pages/。
域名修改
参考https://help.github.com/articles/using-a-custom-domain-with-github-pages/
在根目录下添加CNAME文件，填写你的域名；
将域名解析到github提供的IP地址，可以通过https://help.github.com/articles/setting-up-an-apex-domain/查询，当前是
192.30.252.153
192.30.252.154