本站采用的闰月(Leap Month)主题正式发布

本站采用的闰月(Leap Month)主题正式发布

经过近一周的持续改进,本站自用的 Jekyll 主题——闰月主题(Leap Month)终于完善至可以发布的水平,从本站分离后正式在 GitHub 发布。版本号与本站项目版本号一致,目前为 V2.1 版本。

项目主页:https://github.com/qyxf/leap-month

主题简介

闰月主题衍生自 GitHub Pages 服务默认提供的闰日主题(Leap Day)。取名为「闰月」,是来自于这样一个事实:西方阳历通过「闰日」补足年历误差,中国农历(阴阳历)则通过数年之内的「闰月」补偿年余;作为「闰日」主题的改进版本,闰月主题更佳贴合中文网站的需求,并改进了其原有的若干问题。

当然,在开发的过程中,新的问题也会不断产生——这需要持续不断的改进。

具体而言,闰月主题有以下几个特性:

  • 主要为中文网站设计,并对正文排版效果、移动端体验进行了优化;
  • 页面更加精简、清晰,配色清爽明快,符合广大人民群众的基本审美要求
  • 默认开启 MathJax 公式引擎、pangu.js 排版优化工具、Font Awesome 图标等插件,并默认采用国内的 CDN 服务为插件加速;
  • 通过 JQuery 生成了一个基本的导航菜单(动态目录),改善长篇内容的阅读体验;
  • 内容简单,可拓展性强,专为项目主页、社团网站等通用性强、自定义页面多的站点(而非个人博客)设计。

除此以外,我也在源代码方面做了一些改进,使之更佳规范、清晰。

使用方法

使用远程主题

在需要使用主题的 Jekyll 代码仓库中,为 _config.yml 配置文件附加一条数据:

remote_theme: qyxf/leap-month

此条元数据允许 GitHub Pages 服务(及你的本地 Jekyll 工具)通过 jekyll-remote-theme 从 GitHub 上调用闰月主题——你可以参考这篇 GitHub 博客的说明。注意,在使用本主题的同时不要通过 theme 指定其他的主题。

在确定主题之后,还需要在 _config.yml 完善一些站点的元数据,包括站点标题 title、副标题 subtitle 等。你可以访问项目主页,以了解更多细节。

克隆到本地

如果你希望获得本主题的源代码,将其布置在自己的代码仓库中,你可以直接在 GitHub 上克隆本主题的代码,覆盖到本地仓库之后再做若干改动,如配置元数据等。同样的,请参考项目主页,以了解更多细节。

开发过程

本站在建站之处,直接从远端调用 GitHub Pages 默认支持的 Leap Day 主题。在通过覆盖主题样式表与脚本的过程中,渐感原主题的诸多局限,包括但不限于:

  • 布局优化不足,且移动端体验不佳——大部分辅助模块均被隐藏;
  • 对中文支持不佳——导航菜单将中文全部过滤致其失效、页面附加信息固定为西文,引用块默认斜体破坏中文显示效果;
  • 配色方案缺少亮点,对比度不强,站点难以给读者留下深刻影响;
  • HTML 模版缺少对页面、文章元数据的支持;
  • 排版效果一般,不适合展示非技术性内容。

此外,我还注意到,包括 Leap Day 在内的各个 GitHub Pages 内建主题项目已经不太活跃,近一两年来的更新很慢。

起初,我直接在本仓库中新建 assets 目录,覆写、覆盖 Leap Day 主题的样式表与脚本;随着改动越来越多,样式表方面的覆盖越发受限,零碎的语句也越发难以维护——这使我决定在 Leap Day 主题的基础上重写相关文件,「另起炉灶」。在今年 7 – 8 月间,我进行了大量的尝试,并最终于 8 月 24 日将重写的主题源代码嵌入本站仓库,摆脱了对 Leap Day 主题的远端依赖。经过 9 月的若干次改进,我在 10 月 1 日将代码初次分离到新的代码仓库中,经过一个多星期的改进,至今天正式发布第一个版本。

后记

本人并没有系统学习过前端技术,做此方面的尝试主要是为了适应钱院学辅与网站本身的需求。不过,如果这个主题能够在更广大的范围内给予他人助益,我将感到非常欣慰;同时,也欢迎热心的使用者为本主题提出改进建议,不断完善其功能。

欢迎您关注闰月主题的项目主页,并为我们的项目标星。

参与讨论