Ghost 04 - Ghost 主题修改

image-20200822194626300

本站使用的主题可以通过访问 https://github.com/JiapengLi/ghost-theme-kaldorei 获取。

原主题由xiaoluoboding 提供 https://github.com/xiaoluoboding/ghost-theme-kaldorei,在此致以感谢。

可以查看 git 仓库获取详细的变革说明。参考如下指令(其中 moment 为标准库,文件较大不利于对比,排除后查看)

git diff v3.0.1 HEAD ':(exclude)assets/plugins/moment-2.24.0'

主题至少需要修改如下文件partials/social.hbs,变更作者信息。其他文件如无特殊需求可以不用修改。

具体的使用说明参考:http://blog.xlbd.me/kaldorei/

xiaoluoboding 现在的博客网站已经变为使用 veupress 框架了,猜测后期对这个主题的继续支持迭代的可能估计不大了。;(

Code injection

如下是本博客用到的具体配置。其中部分字段需要根据博客不同进行更改,不可全盘照抄。

<script>
    var disqus_shortname = 'yijiazhiyantang';
    var ghosthunter_key = '171fa25be2073e288fea5e7072';
</script>

<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-41215726-2"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'UA-4121xxxx-2');
</script>

<link rel="stylesheet" type="text/css" href="/assets/plugins/highlight-latest/styles/monokai-sublime.css" />


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

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

<script>
  var searchSettings = {
    key: 'a66b6761c1a7e7492bdb216b39',  // Your custom integration Content API Key
    host: 'https://jiapeng.me',  		// Your custom integration API URL
  };
</script>

<style>
:root {    
  --primary-color: #00aad4;
  --primary-light-hover: #5fbcd3;
  --primary-dark-hover: #0088aa;
}
</style>

心得体会

  • 按模板进行修改,对于 js / css / html 零基础的我来说,难度不是很大,主要依托于查资料,大部分都是苦力活。当然想随心所欲的改还是做不到的。
  • 对于 ghost 这样的框架来说,大部份的活都被完成的差不多了,主题的开发工作量相对不是特别大
  • 网上有人吐槽 ghost 的站内搜索功能支持的不好,v2 时后就是如此了,v3 好像也没有太大的改进
  • ghost 由于是依托自己的商业托管平台来进行技术开发,功能上的提升和改进 v2 到 v3 都不是太大
发表于: 作者:JiapengLi
由于某种不存在的原因,评论区正在努力加载中……