Jian，遵循黑白调、简洁风、高性能、以纯写作为主而诞生的一款Ghost主题，配色设计简单，但是功能和性能是一样不减；

Jian这款主题的主要设计理念来自Ghost官方默认主题 casper ，当然还有一些自己和互联网上的设计！

计划写这种风格的主题已经好长时间了（其实也就一个多月），由于强迫症的原因，一直是写到百分之？的时候就删掉重写；

以前也写过一个Ghost主题White-Block ,还是刚接触前端不久写的，现在看起来太囧了；

预览图（最好自己体验）

首页

白天模式

夜晚模式

菜单栏展开后的首页


文章页

白天模式

夜晚模式

标签云

功能和特色

  • 黑白色调为主；
  • 炫酷的侧边滑动菜单栏设计；
  • 响应式设计,这年头的网站没有响应式简直就是难(la)受(ji),无论是你桌子上摆的、包包里放的还是裤衩里装的统统可以适配;
  • 高大少的Pjax技术；
  • 代码高亮；
  • 自定义首页头图背景；
  • 自动/手动切换网页配色为夜间模式或白天模式；
  • 不丰富的社交按钮，只有4个；
  • 文章页图片放大功能；
  • 支持嵌入第三方评论，特别优化过多说；
  • Alpha版本，更多功能和优化请期待，谢谢！

所含开源项目

  • jQuery
  • jQuery.pjax.js
  • highlight.js
  • waves.js
  • FontAwesome
  • Zoom.js

使用注意

本主题提供 免费使用 ，但是不能魔改和修改底部版权信息，转载请注明项目主页；请务必遵守，这是对作者最起码的尊重；

本主题同时也提供 收费版 ，其实就是卖个不让免费版干的事（收费版可以魔改和去除页面底部的版权信息以及更新后能及时收到邮件通知）；

下载与购买

点击我 前往Github下载，可以的话来一个Star吧？

收费版只需 38元 ，38元在如今还不够一天饭钱是不是啊，38也是我的生日（不是妇女节）；如需购买请电子邮件或微信联系我，或者直接支付宝转账（记得附上你的网站信息和邮箱哦）。购买后我会将你的域名留在本页面；

更新日志

  • 2017.01.10 发布Alpha 0.12;
  • 2017.01.11 发布Alpha 0.2;
  • 2017.01.13 发布 V1.0;
  • 2017.01.31 发布 V2.0；
  • 增加自动/手动切换网页配色为夜间模式或白天模式；
  • 增加首页头图自定义功能；
  • 优化首页文章摘要输出部分；
  • 文章页图片放大功能；
  • 以及其他部分细节优化；
  • 2017.02.21 发布 V2.1；
  • 修复文章底部第三方评论界面；
  • 修复部分超链接颜色；
  • 增加浏览器禁止缓存？
  • 2017.02.23 发布 V2.2
  • 优化部分字体显示；
  • 改造友情链接页面；
  • 增加文章加载动画；
  • 2017.02.28 发布 V2.3
  • 优化首页头图的显示比例；
  • 优化标签云页面；
  • 2017.03.14 发布 V2.4
  • 优化部分页面的字体样式；
  • 增加文章页头图功能；
  • 增加文章页打赏功能；
  • 优化白天/夜晚模式；
  • 2017.03.16 发布 V2.4.1
  • 优化部分页面的加载效果；

使用方法

安装

到Github或OSC@Git下载主题后在网页后台直接上传或使用FTP上传到你的Ghost目录下的 content/themes 目录里，然后解压；

上传后你还需要在你的Ghost网页后台更换主题；

修改侧边栏里的微博、Github、邮箱地址

打开本主题的 partials 目录里的 navigation.hbs 文件，根据注释修改href属性；

<div class="page-nav-icon">
        {{!-- 微博 --}}
        <a href="" class="fa fa-weibo"></a>
        {{!-- Github --}}
        <a href="" class="fa fa-github"</a>
        {{!-- 邮箱 --}}
        <a href="" class="fa fa-envelope"></a>
        {{!-- RSS --}}
        <a href="{{@blog.url}}/rss" class="fa fa-rss"></a>
</div>
更换首页头图

默认为纯色显示，就如我的博客一样，但是你可以自定义图片，只需要在你的Ghost后台设置Blog Cover即可；

嵌入第三方评论代码

获得第三方评论代码后，将第三方评论代码添加至下面注释部分之间，然后将所有代码复制粘贴到本主题的 partials/comments.hbs 文件里；

<a href="javascript:;" class="post-page-comments-title">评论</a>
<div class="post-page-comments">
<!-- 下面是第三方评论代码 -->

<!-- 上面是第三方评论代码 -->
</div>
侧边栏（导航菜单栏）

导航栏里的导航链接是Ghost后台设置的Navigation，所以直接在后台添加链接即可；

头像是用的blog@logo，你只需在Ghost后台上传blog@logo就行了；

标签云页面

首先需要开启你的Ghsot的Labs中的Public API；

然后新建一个独立页面，这个独立页面的URL为 tags ；

友情链接页面

新建一个独立页面，这个独立页面的URL为 links ；

友情链接写法
<div>

<!-- 下方为友链 -->
<a class="links-btn" href="网站链接">网站标题<span>网站简介</span></a>
<!-- 上方为友链 -->

<div style="clear:both;"></div>
</div>
网站favicon图标

将你的favicon.ico文件放到Jian/assets/images/目录里即可；

手动切换网页白天/夜间模式

本主题自动调整白昼模式，晚上22点到早上6点是夜间模式，其他时间为白天模式，当然你也可以手动改变网页配色，只需点击网页右上角标示太阳或月亮的小图标即可；

文章页打赏功能

打开 post.hbs ，找到下图的代码，给img标签的src属性添加上二维码图片url,保存，重启ghost即可；

二维码图片推荐 256x256 或 128x128 ；