23 August 2014

来自: Jekyll 教程三:目录结构

缘起

转载他人的成果,供自己查阅使用。

常用变量


了解完全局的配置之后,我们还需要了解 Jekyll 的变量。通过这些变量,可以输出文章的标题、内容、链接等等。

全局变量

变量 描述
site 通过 _config.xml 来设置整个站点的信息和全局配置。
page 设置页面信息和自定义的变量。
content 展示文章或者页面的内容。
paginator 当配置文件中设置了 paginator 的时候,这里可以读取分页的信息。

站点变量

变量 描述
site.time 当你运行jekyll时候的时间。
site.pages 当前的页面列表。
site.posts 倒序列出所有的文章。
site.related_posts 相关的文章。默认配置下最多 10 篇相关文章。
site.categories.CATEGORY 某一个分类的文章列表。
site.tags.TAG 某一个标签的文章列表。
site.[CONFIGURATION_DATA] 配置文件中的信息。

页面变量

变量 描述
page.content 页面渲染出来的内容。
page.title 页面标题。
page.excerpt 文章摘要。
page.url 页面链接地址。
page.date 页面或者文章的时间。
page.id 页面或者文章的唯一标识。
page.categories 页面或者文章的分类。
page.tags 页面或者文章的标签。
page.path 页面的路径。
page.CUSTOM 页面的自定义内容。

分页

变量 描述
paginator.per_page 每个分页的文章数量
paginator.posts 分页里的文章对象
paginator.total_posts 文章的总数
paginator.total_pages 分页的页数
paginator.page 当前第几页
paginator.previous_page 前一页的页码
paginator.previous_page_path 前一页的地址
paginator.next_page 下一页的页码
paginator.next_page_path 下一页的地址

有了这些变量,自定义一个 Jekyll 博客主题,应该不是一件难事。

Jekyll中的使用的变量和逻辑与其只用的模板Liquid很大的干系。

主题

基础的知识了解到了,我们应该会有更高的要求。自定义自己的 Jekyll 博客,应该如何去做呢?

第一次使用 Jekyll 搭建一个博客,那时候的版本还是 0.9 ,如今已经升级到了 1.1.2,着实增加了不少很有用的功能。例如最基础的分类和标签功能,之前还是需要写插件支持。

有了这些新的功能之后,我们更期望博客可以自定义主题。之前写过好多个 Jekyll 主题:

  • pizn.github.io
  • Black Cube
  • the One

基本都是围绕这主题做修修补补。那么在自定义博客的时候,需要注意些什么呢?这里有之前写过的一些总结:

  • Jekyll 的一些函数和技巧
  • 为 Jekyll 博客添加静态搜索
  • 快速创建漂亮的项目页面
  • 优化 Jekyll 站点的 SEO 技巧
  • Jekyll 菜单高亮

如今在这里一口气写了六篇介绍 Jekyll 的文章,也是做下铺垫,后续有时间,我会写出更多漂亮好用的 Jekyll 博客主题。

Kunka主题

Jekyll 升级到 1.1.2 之后,增加了很多新的特性,于是把画了很久的一个博客主题写了出来。今天简单介绍一下 Jekyll 主题 Kunka。

主题预览:

kunk主题

主题介绍:

Jekyll 的博客主题设计都很简单,首页、归档、关于和链接页面。此次 Kunka 主题,设计风格趋向 Flag 设计风格,配色方案和谐,配置丰富。内置了两种评论方式:「Disqus」和「多说」。

主题配置:

要配置自己的博客,需要修改_config.yml文件,可自定义内容:

  • 站点信息: 例如站点标题、描述、关键字等 SEO 相关,默认 URL 链接和 RSS 链接。
  • 菜单: 想要自定义菜单,排序?都可以。
  • 作者信息: 包括邮箱,简介,详细介绍等。
  • 社交: 因为每一个社交图标,都是 Font-Awesome 字体,所以需要先了解下每个图标的名字。
  • 友情链接: 可以定义很多项,最后在 Links 页面出现。
  • 谷歌分析: 只要输入您的 UA 就可以。
  • 评论: 两种评论系统可以选择,disqus 和 duoshuo。

这些信息,都可以参考主题源文件的_config.yml。

主题源文件:

恩,迫不及待了?主题源文件在这里kunka @ github:

点击查看 DEMO

如果你有发现 Bug 或者哪个拼音平错了,请在这里留言哈。 后续计划:

目前只发布一个简单的版本,基本可以满足您的需求。后续 TODO:

响应式设计,多终端可以查看博客哦。
添加 Category 和 Tag 功能。「本地服务器」可以使用,GitHub page 暂时没有这个功能。

LICENSE

Kunka 主题由 掌心 设计和开发,代码开源在 GitHub 项目 Kunka 上,采用 MIT 协议。如果你使用该主题,请注明由 zhanxin.info 设计即可。




傲娇的使用Disqus