hexo_matery


hexo_matery

文章前缀

配置选项 默认值 描述
title Markdown 的文件标题 文章标题,强烈建议填写此选项
date 文件创建时的日期时间 发布时间,强烈建议填写此选项,且最好保证全局唯一
author _config.yml 中的 author 文章作者
img featureImages 中的某个值 文章特征图,推荐使用图床(腾讯云、七牛云、又拍云等)来做图片的路径.如: http://xxx.com/xxx.jpg
top true 推荐文章(文章是否置顶),如果 top 值为 true,则会作为首页推荐文章
cover false v1.0.2版本新增,表示该文章是否需要加入到首页轮播封面中
coverImg v1.0.2版本新增,表示该文章在首页轮播封面需要显示的图片路径,如果没有,则默认使用文章的特色图片
password 文章阅读密码,如果要对文章设置阅读验证密码的话,就可以设置 password 的值,该值必须是用 SHA256 加密后的密码,防止被他人识破。前提是在主题的 config.yml 中激活了 verifyPassword 选项
toc true 是否开启 TOC,可以针对某篇文章单独关闭 TOC 的功能。前提是在主题的 config.yml 中激活了 toc 选项
mathjax false 是否开启数学公式支持 ,本文章是否开启 mathjax,且需要在主题的 _config.yml 文件中也需要开启才行
summary 文章摘要,自定义的文章摘要内容,如果这个属性有值,文章卡片摘要就显示这段文字,否则程序会自动截取文章的部分内容作为摘要
categories 文章分类,本主题的分类表示宏观上大的分类,只建议一篇文章一个分类
tags 文章标签,一篇文章可以多个标签
keywords 文章标题 文章关键字,SEO 时需要
reprintPolicy cc_by 文章转载规则, 可以是 cc_by, cc_by_nd, cc_by_sa, cc_by_nc, cc_by_nc_nd, cc_by_nc_sa, cc0, noreprint 或 pay 中的一个

subtitle的更改

这个我找了很久,最后修改其实是在根目录的_config.yml文件修改subtitle的值就可以。

首页轮播

首先想要看到轮播效果必须先把文章加入轮播里,首页图片和文章图片组成了轮播,如果不把文章加入轮播里就算开启了轮播也没有办法看到轮播效果。

  • cover设置为true即可
  • 然后img设置一下就是其背景

首页背景颜色

我感觉自带的那个背景很丑,直接删掉就好多了,其在matery.css的606-696行,直接删掉吧,感觉加什么颜色都很丑。

导航栏背景颜色

也是matery.css中找到.bg-cover修改,我用的是

.bg-color {
 background-image: linear-gradient(to right, #7371BC 0%, #284D95 100%);
}

里面有很多颜色的设置,可以自己选一个,轮播的地方也有,选一个自己喜欢的颜色就好。

安装live2d动画模型

  1. 模型预览live2d,根据样式自己选择一个喜欢的就好。
    本人选择的是koharu
  2. 安装live2d
    npm install --save hexo-helper-live2d
    npm install live2d-widegt-model-koharu
  3. 根目录的_config.yml添加
    
    live2d:
      enable: true
      scriptFrom: local
      pluginRootPath: live2dw/
      pluginJsPath: lib/
      pluginModelPath: assets/
      tagMode: false
      debug: false
      model:
        use: live2d-widget-model-koharu
      display:
        position: right
        width: 150
        height: 300
      mobile:
        show: false
    
    注意:我安装了live2d之后再运行时报了个错,很多插件就报错了,一个个的下载就好。

底部总浏览量和访问人数总是隐藏

有时候请求busuanzi数据比较慢,然后浏览量和访问人数就会隐藏,可能是默认的,在matery.css中增加以下代码可以让它一直显示

busuanzi_container_site_pv,

busuanzi_value_site_pv,

busuanzi_container_site_uv{

  display: inline !important;

}

豆瓣分享

安装插件

npm install hexo-douban --save

将下面的配置写入站点的配置文件 _config.yml 里(不是主题的配置文件).

douban:
  user: mythsman
  builtin: false
  book:
    title: 'This is my book title'
    quote: 'This is my book quote'
  movie:
    title: 'This is my movie title'
    quote: 'This is my movie quote'
  game:
    title: 'This is my game title'
    quote: 'This is my game quote'
  timeout: 10000

user: 你的豆瓣ID.打开豆瓣,登入账户,然后在右上角点击 “个人主页” ,这时候地址栏的URL大概是这样:”https://www.douban.com/people/xxxxxx/“ ,其中的”xxxxxx”就是你的个人ID了。

builtin: 是否将生成页面的功能嵌入hexo s和hexo g中,默认是false,另一可选项为true(1.x.x版本新增配置项)。

title: 该页面的标题.

quote: 写在页面开头的一段话,支持html语法.

timeout: 爬取数据的超时时间,默认是 10000ms ,如果在使用时发现报了超时的错(ETIMEOUT)可以把这个数据设置的大一点。

如果只想显示某一个页面(比如movie),那就把其他的配置项注释掉即可。

菜单参考,一定要有图标,不然不显示

然后再主题配置文件_config.yml中添加关于此页面的菜单:(下面是我的配置)

menu:
    媒体:
       url: /
       icon: fas fa-list
       children:
         - name: 电影
           url: /movies
           icon: fas fa-film
         - name: 书单
           url: /books
           icon: fas fa-book
         - name: 游戏
           url: /games
           icon: fas fa-gamepad

需要注意的是,通常大家都喜欢用 hexo d 来作为 hexo deploy 命令的简化,但是当安装了 hexo douban 之后,就不能用 hexo d 了,因为 hexo douban 跟 hexo deploy 的前缀都是 hexo d ,你以后执行的 hexo d 将不再是 Hexo 页面的生成,而是豆瓣页面的生成。

添加动态科技线条背景

在themes/matery/layout/layout.ejs文件中添加如下代码:


其中:

  • color:表示线条颜色,三个数字分别为(R,G,B),默认:(0,0,0)
  • opacity:表示线条透明度(0~1),默认:0.5
  • count:表示线条的总数量,默认:150
  • zIndex:表示背景的z-index属性,css属性用于控制所在层的位置,默认:-1

    添加樱花飘落效果

    在themes/matery/source/js目录下新建sakura.js文件,打开这个网址传送门,将内容复制粘贴到sakura.js即可。

然后再themes/matery/layout/layout.ejs文件内添加下面的内容:

<script type="text/javascript">
//只在桌面版网页启用特效
var windowWidth = $(window).width();
if (windowWidth > 768) {
    document.write('<script type="text/javascript" src="/js/sakura.js"><\/script>');
}
</script>

参考:

csdnmatery


文章作者: 万鲲鹏
版权声明: 本博客所有文章除特別声明外,均采用 CC BY 4.0 许可协议。转载请注明来源 万鲲鹏 !
评论
  目录