基于Hexo的matery主题搭建博客自定义修改篇2 _

/* 整体背景颜色，包括导航、移动端的导航、页尾、标签页等的背景颜色. */ 
.bg-color { 
	background-image: linear-gradient(to right, #4cbf30 0%, #0f9d58 100%); 
} 
/*如果想去掉banner图的颜色渐变效果，请将以下的css属性注释掉或者删除掉即可*/ 
@-webkit-keyframes rainbow { 
	/* 动态切换背景颜色. */ 
} 
@keyframes rainbow { 
	/* 动态切换背景颜色. */ 
}

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

https://cdn.jsdelivr.net/gh/fz6m/Private-web@1.2/js/sakura/sakura-small.js

*{
    cursor: url("/medias/imgs/zhengchang.ico"),auto!important;
}
:active{
    cursor: url("/medias/imgs/dianji.ico"),auto!important;
}

/* .bg-cover:after {
    -webkit-animation: rainbow 60s infinite;
    animation: rainbow 60s infinite;
} */

$('.bg-cover').css('background-image', 'url(<%- theme.featureImages[Math.floor(Math.random() * theme.featureImages.length + 1)-1] %>)');

.toc-widget {
    width: 345px;
    padding-left: 20px;
    background-color: rgb(255, 255, 255,0.7);
    border-radius: 10px;
    box-shadow: 0 10px 35px 2px rgba(0, 0, 0, .15), 0 5px 15px rgba(0, 0, 0, .07), 0 2px 5px -5px rgba(0, 0, 0, .1) !important;
}

<!-- 直达评论 -->
<div id="to_comment" class="comment-scroll">
    <a class="btn-floating btn-large waves-effect waves-light" href="#vcomments" title="直达评论">
        <i class="fas fa-comments"></i>
    </a>
</div>

<%- partial('_partial/back-comment.ejs') %>

/*直达评论按钮样式*/
.comment-scroll {
    position: fixed;
    right: 15px;
    bottom: 135px;
    padding-top: 15px;
    margin-bottom: 0;
    z-index: 998;
}

.comment-scroll .btn-floating {
    background: linear-gradient(to bottom right, #FF9999 0%, #ff6666 100%);
    width: 48px;
    height: 48px;
}

.comment-scroll .btn-floating i {
    line-height: 48px;
    font-size: 1.8rem;
}

/* 滚动条 */
::-webkit-scrollbar-thumb {
    background-color: #FF2A68;
    background-image: -webkit-linear-gradient(45deg,rgba(255,255,255,.4) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.4) 50%,rgba(255,255,255,.4) 75%,transparent 75%,transparent);
    border-radius: 3em;
}
::-webkit-scrollbar-track {
    background-color: #ffcacaff;
    border-radius: 3em;
}
::-webkit-scrollbar {
    width: 8px;
    height: 15px;
}

<h1 class="description center-align post-title"><%= page.title %></h1>

<script src="<%- theme.jsDelivr.url %><%- url_for(theme.libs.js.typed) %>"></script>
<% if (theme.post.enable) { %>
    <script>
        var typedObj = new Typed("#post-title", {
            strings: [ '<%= page.title %>' ],
            startDelay: <%= theme.post.startDelay %>,
            typeSpeed: <%= theme.post.typeSpeed %>,
            loop: <%= theme.post.loop %>,
            backSpeed: <%= theme.post.backSpeed %>,
            showCursor: <%= theme.post.showCursor %>
        });
    </script>
<% } %>

# 文章标题
post:
  enable: true
  loop: false # 是否循环
  showCursor: true # 是否显示光标
  startDelay: 500 # 开始延迟
  typeSpeed: 100 # 打字速度
  backSpeed: 50 # 删除速度

@font-face{
    font-family: '引用的字体名称';
    src: url('谷歌字体路径（或者其他什么字体引用）');   
}

#artDetail {
    font-family: '引用的web字体';
}

/*使用我在文章内容详情定义的diyFnot类**/
.diyfont {
   font-family: '引用的web字体'; 
}

/*也可以使用自带的id*/
#artDetail {
    font-family: '引用的web字体'; 
}

@font-face{
    font-family: '引用的字体名称';
    src: url('谷歌字体路径（或者其他什么字体引用）');   
}

body {
    font-family: '引用的web字体名称'; 
}

@font-face{
    font-family: 'hl';
    src: url('../diy-font/IBMPlexMono-Italic.ttf');
}

/** 表示全局使用，如果不想全局使用不要添加该段 */
body{
    font-family: 'hl';
}


/* 可以局部使用，建议添加 */
.diyFont{
    font-family: 'hl';
}

<span class="logo-span diyFont">测试字体</span>

<span class="logo-span diyFont"><%= config.title %></span>

/* 整体背景颜色，包括导航、移动端的导航、页尾、标签页等的背景颜色. */
.bg-color {
  background-image: linear-gradient(to right, #4cbf30 0%, #0f9d58 100%);
}

@-webkit-keyframes rainbow {
  /* 动态切换背景颜色. */
}

@keyframes rainbow {
  /* 动态切换背景颜色. */
}

$(".bg-cover").css("background-image", "url(/medias/banner/" + new Date().getDay() + ".jpg)");

---
title: tools
date: 2020-04-28 00:00:00
type: "tools"
layout: false
---

# 指定目录跳过hexo渲染
skip_render:
  - 'tools/*'
  - 'tools/**'

npm install --save hexo-tag-aplayer

{% aplayer title author url [picture_url, narrow, autoplay, width:xxx, lrc:xxx] %}

{% aplayer "她的睫毛" "周杰伦" "http://home.ustc.edu.cn/~mmmwhy/%d6%dc%bd%dc%c2%d7%20-%20%cb%fd%b5%c4%bd%de%c3%ab.mp3"  "http://home.ustc.edu.cn/~mmmwhy/jay.jpg" %}

aplayer:
	meting: true

<!-- 简单示例 (id, server, type)  -->
{% meting "571184509" "xiami" "playlist" %}

npm install --save hexo-tag-dplayer

{% dplayer key=value ... %}
例：
{% dplayer "url=http://www.nenu.edu.cn/_upload/article/videos/03/5f/7c999eed42e3aadc413d7f851f0e/0f50b3eb-9285-41d2-ac4d-6cc363651aad_B.mp4"  "autoplay=true" "preload=metadata" "hotkey=true" %} 

<iframe height=498 width=510 src='https://player.youku.com/embed/XMjk4ODAyMzIyOA==' frameborder=0 'allowfullscreen'></iframe>

## npm 安装
npm install hexo-external-link --save
## yarn 安装
yarn add hexo-external-link

hexo_external_link:
  enable: true
  enable_base64_encode: true
  url_param_name: 'u'
  html_file_name: 'go.html'
  target_blank: true
  link_rel: 'external nofollow noopener noreferrer'
  domain: 'your_domain' # 如果开启了防盗链，填写你的域名
  safety_chain: true

premalink: :year/:month/:day/:title

npm install hexo-abbrlink --save

abbrlink: 
    alg: crc16 #算法：
    crc16(default) and crc32 rep: hex #进制： dec(default) and hex: dec #输出进制：十进制和十六进制，默认为10进制。丨dec为十进制，hex为十六进制

permalink: posts/:abbrlink.html  # 此处可以自己设置，也可以直接使用 :/abbrlink