探索个性化选项
侧边栏组件
Stellar 和 Volantis 同样支持强大的自定义组件功能,默认提供的组件在主题配置文件中已经列出:
1 | # Sidebar widgets |
在 front-matter
中写上它们的名字,侧边栏就会按顺序显示这些小组件:
1 | sidebar: [welcome, toc] |
和 Volantis 一样,您可以使用模板创建任何组件,在任何页面的侧边栏显示。推荐将自己的组件配置写在数据文件中:
1 | welcome: |
目前支持的布局模板有:markdown
,后续将会加入列表、网格等布局模板。
Q: 如果不想显示默认的 welcome 组件怎么办?
A: 删掉它就可以啦。
Q: 如果想在 welcome 那个位置显示成其它布局的组件?
A: 把 welcome 组件的属性都改成你想要的那个组件的就可以啦。
评论
共用评论数据
如果您有多个页面需要共用评论数据,可以把它们的 comment_id
设为相同的值,例如:
1 | title: 关于 |
1 | title: 友链 |
使用其它评论数据
如果您有多个页面需要另外一个数据库的评论数据,以 Beaudar 为例,您可以这样:
1 | title: 快速开始您的博客之旅 |
文章自定义
是否自动生成封面
根据 tags
作为关键词为每一篇文章在线搜索封面:
1 | article: |
是否自动生成摘要
建议您通过 description
或者 excerpt
方式生成摘要,但如果您希望自动从文章内容截取一定字数的文字作为摘要,可以这样设置:
1 | article: |
相关文章推荐
要实现相关文章推荐功能,您需要安装插件:
然后在主题配置文件中开启:
1 | article: |
自定义样式
如果要修改样式,您需要删掉主题的样式文件的 CDN 链接,使用本地文件,然后在 themes/stellar/source/css/_custom.styl
中进行修改。
使用其它 highlight.js 代码高亮主题
Hexo 官方有文档: https://hexo.io/docs/syntax-highlight.html#hljs
Tip: When line_number is set to false, wrap is set to false and hljs is set to true, you can then use highlight.js theme directly in your site.
以 atom-one-dark
主题为例,翻译过来就是 _config.yml
找到 highlight
并修改为:
1 | highlight: |
然后再找到 inject
新增一个 css 链接:
1 | inject: |
外部文件注入
在站点根目录下的配置文件中进行修改 inject.head
以在 <head>
标签末尾处注入代码,修改 inject.script
以在 <body>
标签末尾处注入代码。
1 | inject: |