Skip to content

Latest commit

 

History

History
386 lines (284 loc) · 9.49 KB

README_CN.md

File metadata and controls

386 lines (284 loc) · 9.49 KB

Hexo-theme-obsidian

v1.x | ᴅᴇsɪɢɴᴇᴅ & ᴄᴏᴅᴇᴅ ʙʏ ᴛʀɪᴅɪᴀᴍᴏɴᴅ

一款暗色的Hexo主题, 拥有响应式布局, 简约而优雅.

Latest Release Version Latest Release Date License Join the chat at https://gitter.im/TriDiamond/hexo-theme-obsidian

预览 | 更变日志

🇺🇸 English Doc | ChangeLog

screenshot

更多主题展示

分类页

screenshot

多级分类

screenshot

归档页

screenshot

文章页

screenshot

安装

$ git clone https://github.com/TriDiamond/hexo-theme-obsidian.git obsidian

使用

启用主题

打开 Hexo 配置文件 _config.yml, 设置主题为 obsidian

...
theme: obsidian
...

主题配置

打开 /themes/obsidian/_config.yml 文件可以改变主题配置

详细配置文件,点击展开
#! ---------------------------------------------------------------
#! 版本`v1.3.5`开始代码高亮已经用`codemirror`替换了`highlight.js`,
#! 但是Hexo默认的highlight配置还是需要关闭的。
#! !!所以务必把Hexo默认的highlight配置改为`enable: false` !!
#! ---------------------------------------------------------------
#! highlight:
#!  enable: false
#!  line_number: true
#!  auto_detect: true
#!  tab_replace:
#! ---------------------------------------------------------------

# ---------------------------------------------------------------
# 主题默认设置
# ---------------------------------------------------------------

# 菜单设置 | 格式 = 菜单名: 菜单url
menu:
  PAGE: /page

# 分类页和标签页自定义标题配置
page_titles:
  categories: "Categories"
  tags: "Tags"
  archives: "Archived"

# 是否启用目录
TOC: true

# 首页封面使用的封面图, 不配置默认使用cover配置的图片
welcome_cover: /img/cover.jpg

# 文章默认封面图
cover: /img/welcome-cover.jpg

# 文章内的默认头像
avatar: https://s2.ax1x.com/2019/09/19/nLtSiD.png

# 关闭默认滚动条
scrollbar: true

# 网站的关键词,都好分割,用于SEO优化
keywords: TriDiamond Obsidian

# 网站口号
descriptionOne: "Think like an artist, develop like an artisan"
descriptionTwo: "艺术家思维去思考问题,工匠创造精神去开发"

# 如果使用google analytics, 请填写ID
google_analytics:

# 网页图标
favicon: /img/favicon.png

# rss文件
rss: atom.xml

# ---------------------------------------------------------------
# 文章音乐设置
# ---------------------------------------------------------------

# 自动播放音乐
autoplay: false

# 默认mp3文件
mp3:
  - statics/chengdu.mp3

# ---------------------------------------------------------------
# 主题插件
# ---------------------------------------------------------------

# Gitalk 评论插件
# 查看 https://github.com/gitalk/gitalk
gitalk:
  autoExpand: false
  clientID: ''
  clientSecret: ''
  repo: ''
  owner: ''
  admin: ['']
  # Ensure uniqueness and length less than 50
  id: location.pathname
  # Facebook-like distraction

# Valine 评论插件 (推荐使用!)
# 查看 https://valine.js.org/quickstart.html
valine:
  enable: true
  app_id:
  app_key:
  notify: false
  verify: false
  avatar: 'mp'
  placeholder: 'Leave your throughs behind~'
  visitor: true

# 文章字数和阅读时间统计插件
# see https://github.com/theme-next/hexo-symbols-count-time
symbols_count_time:
  enable: true
  wordCount: true
  readCount: true
  awl: 4
  wpm: 275
  suffix: mins.

# html截取插件(用于首页截取内容)
# see https://github.com/TriDiamond/hexo-html-truncate
html_truncate:
  enable: true
  # 文章保留多少个字符
  postLength: 250
  # 封面文章保留多少个字符
  coverLength: 100
  # 省略符号
  ellipsis: '...'
  # 需要过滤的html标签
  excludes: ['img']
  # 截取时保留空白空格字符
  keepWhitespaces: true
  # 截取到最后的时候保留完成的字(只对英文有用)
  reserveLastWord: true

# Busuanzi 浏览量统计插件
# see http://ibruce.info/2015/04/04/busuanzi/
busuanzi:
  enable: true

# Sharejs 分享
# see https://github.com/overtrue/share.js/
sharejs:
  enable: true
  disabled: 'facebook,douban,linkedin,diandian,tencent,google'

# 使用了codemirror替换了highlight.js,代码高亮更加完善,也更接近IDE的高亮样式
# 默认已经填入了一些语言的mode支持,如果你需要其他语言的支持,请查看codemirror官网的mode
# modes文档请看: https://codemirror.net/mode/
# codemirror官网: https://codemirror.net/
# 默认支持了:JS, HTML, CSS, PHP, JAVA, C, C#, C++, SHELL, PYTHON.
codemirror:
  modes: ['javascript', 'css', 'xml', 'htmlmixed', 'clike', 'php', 'shell', 'python']

# 启用 mathjax 支持
mathjax: true

评论插件

评论插件可以选择使用 Valine 或者 Gitalk

  • 如果你是使用 Valine, 你需要关闭 busuanzi, 因为 Valine 自带有文章浏览量统计.
  • 如果你是使用 Gitalk, 你可以打开 busuanzi 文章详情页就会显示文章浏览量统计.

代码块样式

版本v1.3.5开始代码高亮已经用codemirror替换了highlight.js, 但是Hexo默认的highlight配置还是需要关闭的。 !!所以无比把Hexo默认的highlight配置改为enable: flase !!

在博客根目录的_config.yml修改

⚠️ 注意不是主题里面的_config.yml,在主题里面加这个是无效的哦

...

highlight:
  enable: false
  line_number: true
  auto_detect: true
  tab_replace:

...

Codemirror代码高亮配置

# 使用了codemirror替换了highlight.js,代码高亮更加完善,也更接近IDE的高亮样式
# 默认已经填入了一些语言的mode支持,如果你需要其他语言的支持,请查看codemirror官网的mode
# modes文档请看: https://codemirror.net/mode/
# codemirror官网: https://codemirror.net/
# 默认支持了:JS, HTML, CSS, PHP, JAVA, C, C#, C++, SHELL, PYTHON.
codemirror:
  modes: ['javascript', 'css', 'xml', 'htmlmixed', 'clike', 'php', 'shell', 'python']

修改了默认highlight配置后需要重新生成文件

hexo clean && hexo g

文章展示字符数控制

文章里面的参数preview控制在首页展示时保留的字符数

title: My awesome title
date: 2019-07-14 18:38:45
categories:
    - Category1
    - Category2
tags:
    - Tag1
    - Tag2
mp3: http://domain.com/awesome.mp3
cover: http://domain.com/awesome.jpg
preview: 300

文章模版

文章模版设置

title: My awesome title
date: 2019-07-14 18:38:45
categories:
    - 分类1
    - 分类2
tags:
    - 标签1
    - 标签2
mp3: http://domain.com/awesome.mp3
cover: http://domain.com/awesome.jpg

创建分类页

运行 Hexo 命令

hexo new page categories

分类模版

title: categories
date: 2019-07-14 12:39:04
type: "categories"

主题会自动生成分类内容,模版里面留空不用改动就可以了。

创建标签页

运行 Hexo 命令

hexo new page tags

标签模版

title: tags
date: 2014-12-22 12:39:04
type: "tags"

主题会自动生成标签内容,模版里面留空不用改动就可以了。

MathJax 支持

默认是启用MathJax支持的, 如果需要关闭改变主题配置为 false

# 启用 mathjax 支持
mathjax: true

更新主题

更新前请先备份主题里的 _config.yml 文件

cd themes/osidian
git pull

使用搜索功能

安装说明

NPM安装

$ npm install hexo-generator-search --save

在你的根目录配置 _config.yml 里面添加hexo-generator-search的配置

search:
  path: search.xml
  field: post
  content: true

重新生成静态文件

hexo clean && hexo g

相关

做了一个 Typro 主题 Obsidian 专门给写博客的你们.

反馈

大家记得先看一下ISSUE里面有没有你的问题,已经解答了的。 很有可能你的问题已经被问过了,或者可以在Issue里面就找到答案了!谢谢配合!

可以通过以下方式反馈问题: