目录
- Jekyll 和 Github Pages是什么?
- Jekyll 基础
- 本篇文章主要内容
- 1. 使用collection
- 2. 配置左侧边栏
- 3.优化前后页按钮
- 4. 添加代码块一键复制功能
- 5. 更改Logo和Favion
- 6. 修改字体高亮颜色和大小
如何快速使用博客见Jekyll + Github Pages快速使用 , 本篇文章讲述如何改造Jekyll的TeXt主题。
Jekyll 和 Github Pages是什么?
Jekyll 是一个简单的博客生成工具。
GitHub Pages 是一个静态网站托管服务,直接从github仓库托管你个人、公司或者项目页面 ,并且不需要你写任何后端语言来支持。托管在GitHub Pages上,就可以从网络上访问你的博客。
要发布博客的话,既可以在本地添加添加markdown文件,推送到GitHub仓库,也可以直接在Github上进行编辑。
Jekyll 基础
1. Jekyll 目录结构
__posts 博客内容
_pages 其他需要生成的网页,如About页
_layouts 网页排版模板
_includes 被模板包含的HTML片段,可在_config.yml中修改位置
assets 辅助资源 css布局 js脚本 图片等
_data 动态数据
_sites 最终生成的静态网页
_config.yml 网站的一些配置信息
index.html 网站的入口
2. 关于布局
以首页为例,打开根目录下的index.html
(网站首页)可以看到:
—
layout: articles
—
html代码段
上面的articles
就是_layouts\articles.html
,布局中又可以通过如下方式就像调用函数一样调用_includes
下的html片段
{%- include article-list.html articles=_articles type=‘grid’ -%}
注:其他页面的布局设置为_config.yml
中的defauls/values/layout
3.更进一步
如果想更详细的了解Jekyll,可以访问:
- Jekyll官方网站
- Jekyll使用的模板语言:Liquid
- 极客学院的Jekyll教程
- Github+Jekyll 搭建个人网站详细教程