Note - 大气时尚适合写作的博客主题

Note正如其名字一样,是一款适合写作、做笔记的博客主题,设计风格来自我的上一款主题 《Jian》 ,也可以理解为《Jian》的升级版、整容版;

计划发布Ghost、Tyepecho、Hexo三个版本,目前已发布了Ghost和Typecho两个版本;

注意:此款主题目前仍处于开发阶段,所以会不断地增加新功能和优化,如果你在使用此款主题请密切关注此篇文章或Github

预览图

先是首页

导航栏展开状态的首页

最后是文章页

还有好多页面没有展示出来,如果你感兴趣的话可以换上主题自己体验一发;

功能和特色

  • 适合写作的设计;
  • 炫酷的侧滑导航栏设计;
  • 文章页打赏功能;
  • 紧凑的按钮设计;
  • 响应式设计;
  • Pjax技术;
  • 代码高亮;
  • 又大又长的首页头图;
  • 不丰富的社交按钮,只有4个;
  • 文章页图片放大功能;
  • 支持嵌入第三方评论;
  • 支持Ghost、Typecho、Hexo这三个平台;
  • Alpha版本,更多功能和优化请期待,谢谢!

所含开源项目

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

使用注意

本主题提供免费使用,但是:

  • 不能修改任何代码(不包括媒体文件路径和超链接);
  • 不能去除底部版权信息;

请务必遵守以上几项,这是对作者最起码的尊重;

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

下载与购买

在Github给此项目个star吧!

选择适合自己平台的版本下载:Ghost版Typecho版


Typecho版Hexo版

收费版只需 50 元,在这个年代说50块贵的同学说明爱还不够;如需购买请电子邮件或微信联系我,当然也可以直接支付宝转账(记得附上你的网站信息和邮箱哦)。

E-mail : i@weic96.cn
微信 : cw1104365773(可扫页面底部“赏”中的二维码)
支付宝 : weic96@vip.qq.com(可扫页面底部“赏”中的二维码)

另外也接受主题功能定制和新主题制作(收费);

购买过此主题的博主
博客 版本
Kaine`s Blog Ghost
Samzong Ghost

更新日志

  • 2017.04.11 自测 V0.1
  • 2017.04.12 发布 V0.2
  • 2017.04.12 发布 Ghost版本
  • 2017.04.27 发布 Typecho版本

已知Bug

  • Jquery.Pjax.js插件导致部分浏览器回退网站脚本失效;

使用方法

主页面头图推荐分辨率:1920 x 675(反正就是这个比例);
文章页头图推荐分辨率:1920 x 320 (反正也是这个比例);
Ghost使用此主题请务必开启后台的Labs>Public API 功能;

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

Typecho版本的在网站后台主题设置里;

打开本主题的partials目录里的navigation.hbs文件,找到下面代码,自行修改;

<div class="navbar-icon">  
        <a href="" class="fa fa-github navbar-github"></a>
        <a href="" class="fa fa-weibo navbar-weibo"></a>
        <a href="" class="fa fa-envelope navbar-mail"></a>
        <a href="" class="fa fa-rss navbar-rss"></a>
</div>  
嵌入第三方评论代码

获得第三方评论代码后,将所有代码复制粘贴到本主题的partials/comments.hbs文件里的注释之间;

如果你用的是Disqus,请删除comments.hbs将disqus-comments.hbs重命名为comments.hbs,然后修改里面的参数;(此主题针对Disqus做了动态加载功能)

标签云页面

然后新建一个独立页面,这个独立页面的URL为tags ;

友情链接页面

Ghost:新建一个独立页面并按主题指定格式书写,这个独立页面的URL为links ;
Tpecho:新建一个独立页面,选择模板为友情链接模板并按主题指定格式书写;

友情链接写法

第一种:有logo的网站

<div class="links-page">  
<!-- 下方为友链 -->  
<a class="links-btn" href="网站链接"><img src="网站图片" />网站标题</a>  
<!-- 上方为友链 -->  
<div style="clear:both;"></div>  
</div>  

第二种:没有logo的网站

<div class="links-page">  
<!-- 下方为友链 -->  
<a class="links2-btn" href="网站链接">网站标题</a>  
<!-- 上方为友链 -->  
<div style="clear:both;"></div>  
</div>  
网站favicon图标

Ghost:将你的favicon.ico文件放到assets/images/目录里即可;
Typecho:将你的favicon.ico文件放到主题根目录替换原文件即可

文章页打赏功能

Typecho版本的在网站后台主题设置里;

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

Typecho:网站后台主题设置修改:

最后:欢迎提出建议,本站评论系统使用的是Disqus,如果你没有Fan墙可能加载不出来评论;这时你就可以发邮件给我;

下一篇:  Debian从源安装最新版本Nginx  
评论

如果我的文章对你有帮助,或许可以打赏一下呀!

支付宝
微信
QQ