核心提示:Jekyll+GitHub搭建个人博客-不限流/免费/静态网站。参考了其他前辈的博客 ,搭建的过程并不算难 (调整自己喜欢的风格太难了) .虽然是静态网站 ,但是可以嵌入第三方API ,也是可以作为一...
Jekyll+GitHub搭建个人博客-不限流/免费/静态网站。参考了其他前辈的博客 ,搭建的过程并不算难 (调整自己喜欢的风格太难了) .虽然是静态网站 ,但是可以嵌入第三方API ,也是可以作为一个简单的博客网使用的 .熟悉前端的话 ,这一个静态网站也能玩的很高科技。
效果 : 阿东的GitPage 源码 : Anddd7/Anddd7.github.io 参考自 renyuanz/leonidsJekyll - 静态网页模板
Jekyll ,使用模板语言书写静态页面 ,然后由Jekyll程序转换为Html/CSS/JavaScript .
模板语言中可以使用变量 ,也可以定义和引入其他变量 ,可以方便的处理的嵌套/复用 . 模板可以是.md/.html文件 页面/数据分离GitHub - 自动支持Jekyll
GitHub Pages ,在仓库中新建一个 'username'.github.io 的仓库 ,然后上传Jekyll的模板文件(不用上传编译后的)
然后访问 https://’username’.github.io ,Github会自动解析出静态网页并发布上去 .
开始
安装环境
安装Ruby + DevKit 在Ruby环境中安装JekyllPS:Windows上安装
运行Jekyll
//cd到DevKit目录下 cd ../DevKit //新建仓库 jekyll new Pages cd Pages //启动仓库 jekyll serve
编辑
jekyllthemes.org上提供了很多模板 ,可以选中一个你喜欢的 ,然后下载源码进行自定义修改.
草稿 _drafts : 这里面的文章不会直接发布 可复用组件 _includes可以是页面/按钮/组件 ,通过{% include footer.html %}引入 提供了{% if post.link %}这样的语句 ,读取变量: 判断分支/赋值/拼接url 布局 _layouts : 页面的主要结构 文章 _posts 样式的管理 _sass 其他 : 会发布到 _site下 ,可以用来汇总图片/CSS/JS _site : 编译后的生产代码不用上传 ,由Github生成发布
发布
将上述部分直接上传到 'username'.github.io 仓库内即可