Ghost 博客主题 Kaldorei 3.0 发布

小蘿蔔丁

Kaldorei

A Simple And Elegant Ghost Theme Derive From Default Theme Casper

新特性

Kaldorei 3.0 现已支持 Ghost Blog 3.x.

  • 支持 Bookmark 风格卡片
  • 支持代码行号配置
Ghost Tutorials - Practical guides for custom publications
Customise your Ghost publication to suit your needs with full tutorial guides for a variety of use-cases. Config, themes, dynamic routing and more 👉
Ghost

功能

  • [x] 主题基调定为小清新绿色

  • [x] 文章样式色调为墨蓝色

  • [x] 返回顶部

  • [x] 代码高亮

  • [x] 侧边栏

    • [x] 标签云

    • [x] 文章目录

    • [x] 站点信息

    • [x] 作者信息

  • [x] 文章栏

    • [x] 作者信息

  • [x] 首页加载文章动画

  • [x] 响应式设计

  • [x] 归档功能

  • [x] 图片暗箱效果

  • [x] 博客搜索

  • [x] 更改配色与字体

  • [ ] 暗色风格

功能配置

🌐 切换语言

Ghost2.x版本以后支持了语言的切换，Kaldorei 同时也支持了中/英文的切换，默认为英文 en。

方法：ghost后台 > General > Publication Language 改为 zh 即可

🏷️ 标签统计

kaldorei使用了ghost的api来做统计，所以需要开启ghost的实验室中的Public API功能。

方法：ghost后台 > labs > Enable Beta Features > 勾选 Public API

🌄 图片幻灯片

Kaldorei集成了fancyBox，支持图片暗箱效果、幻灯片轮播、全屏预览、缩略图预览等功能。预览&使用方法图片预览

💬 开启Disqus

kaldorei支持Disqus讨论插件，只需在后台代码注入处添加一段代码

方法：ghost后台 > Code Injection > Blog Header
<script>
    var disqus_shortname = 'your_disqus_shortname';
</script>

🗂 开启归档功能

Kaldorei提供了简单的归档功能，使用ghost的api来生成归档，预览博客归档。

Ghost 3.x 方法：ghost后台
  • Pages -> New Page -> 标题输入 Archives ，这时页面的地址默认为 archives
  • Design > 创建一个归档导航，地址为：http://your_blog_url/archives;
  • 去博客首页看看你的归档吧，Have fun.
Ghost 2.x 方法：ghost后台:
  • New Post > 标题输入Archives，这时文章的地址默认为archives;
  • Post Settings > 勾选Turn this post into a page，然后Publish;
  • Navigation > 创建一个归档导航，地址为：http://your_blog_url/archives;
  • 去博客首页看看你的归档吧，Have fun.

🌈 更换代码主题

Kaldorei使用highlight.js实现代码高亮，默认使用的主题风格为 monokai-sublime

方法：ghost后台 > Code Injection > Blog Header
<!-- use solarized-light style -->
<link rel="stylesheet" type="text/css" href="/assets/plugins/highlight-latest/styles/solarized-light.css" />

完整主题列表

🔢 开启显示代码行号

主题版本 3.x 新增

Kaldorei 实现了配置的方式开启显示代码行号，默认是关闭的，支持 dark / light 两种模式

方法：ghost后台 > Code Injection > Blog Header

<script>
  var hljsSettings = {
    lineNumber: true,  // 可选值 flase / true, 默认为 false
    mode: 'light'  // 可选值 dark / light，默认为 'dark'
  };
</script>

不仅行号可以配置，行号的背景色也可以自定义，默认行号背景色如下：

<style>
:root {
  --linenumber-dark-bg: #282c34;
  --linenumber-light-bg: #c5d2d9;
}
</style>

🔍 搜索功能

搜索引擎默认支持按博文标题搜索，此功能需要安装的 ghost 版本 >= 2.10.x。

分为两步：

1、创建自定义集成

方法：ghost后台 > Integrations > Add custom integration

2、配置变量

方法：ghost后台 > Code Injection > Blog Header
<script>
  var searchSettings = {
    key: '__CONTENT__API__KEY__',  // Your custom integration Content API Key
    host: '__API__URL__',  // Your custom integration API URL
  };
</script>

🌈 自定义配色与字体

kaldorei v2.1.0 版本开始，支持了用户可以自定义站点的配色与字体。

方法：ghost后台 > Code Injection > Blog Header
<style>
:root {
  --primary-color: #4af;
  --primary-light-hover: #4cf;
  --primary-dark-hover: #49f;
}
</style>

完整可替换变量，参见这里

🔖 书签卡片 ^3.x

Ghost 3.x 起，提供了一个新的书签卡片功能，它可以展示一个站点的页面标题、摘要信息、作者、发布者以及一个预览缩略图。就像这样：

ghost_bookmark

Kaldorei 在 3.x 版本中也只支持书签卡片功能，如何配置见官网

About ghost helpers

kaldorei 用两种方法实现了标签云，方法参见我的博客。

kaldorei 优化了发布文章的时间展示，并汉化为中文，需要修改时间(date)助手，方法参见我的博客。

感谢社区

License

MIT © xiaoluoboding

comments powered by Disqus