本篇文章只讲述博主建站初期从各网站搜集和自己琢磨写出的非官方文档记录的blog修改过程，博主没有任何html基础与建站经验，内容仅供参考
matery主题的安装与修改优化
matery主题对于我这样的建站新手来说还是比较友好的，主题也很好看自定义程度很高，但是因为其自身缺陷我无法完成部分修改(遇到问题)
去除banner图片背景彩虹色
打开themes/matery/source/css/matery.css文件(367行，也可以快速搜索.bg-cover:after进行定位):
.bg-cover:after {
/* -webkit-animation: rainbow 60s infinite;
animation: rainbow 60s infinite;*/
}然后使用注释掉这两行css(注意需要*/结尾)
头像,页面角标的更改与制作
\themes\hexo-theme-matery\source\中替换favicon.png
\themes\hexo-theme-matery\source\medias中替换avatar.jpg与logo.png
logo制作没有工具的话可以使用此处在线制作
留言板的安装
二选一
gitalk
这边要注意Homepage URL和Authorization callback URL一定要填写自己博客的域名，必须有http前缀，其他的可以随意
申请到之后记录下Client ID与Client Secret，得到之后在 \themes\hexo-theme-matery_config.yml 中搜索gitalk，填入client id与secret并启用
enable: ture
owner: *
repo: *.github.io
oauth:
clientId: ***
clientSecret: *** #填入这两项
admin: *valine
创建一个应用，在存储中新建class:Comment
在设置-应用keys中得到自己需要的key，填入主题的config中并启用
提交谷歌收录
提交认证
选择网域或者网页前缀认证，这边只演示网页前缀的文件验证，网页前缀验证方法速度更快
选择网址前缀的文件验证，得到所需要的文件之后把文件放入博客的source文件夹内，hexo g和d更新博客，然后验证所有权
生成并提交sitemap
首先安装插件
npm install hexo-generator-sitemap --save在博客根目录的config文件中更改url为你的站点地址
# URL
## If your site is put in a subdirectory, set url as 'http://yoursite.com/child' and root as '/child/'
url: https://democrazyzero.site并在博客最下方添加
sitemap:
path: sitemap.xml重新hexo g d打包
最后在search console左方选择站点地图，在你的域名后填入sitemap.xml并提交，之后等待收录即可
数字雨特效
在主题文件夹的source/js中新建DigitalRain.js并写入
window.onload = function(){
//获取画布对象
var canvas = document.getElementById("canvas");
//获取画布的上下文
var context =canvas.getContext("2d");
var s = window.screen;
var W = canvas.width = s.width;
var H = canvas.height;
//获取浏览器屏幕的宽度和高度
//var W = window.innerWidth;
//var H = window.innerHeight;
//设置canvas的宽度和高度
canvas.width = W;
canvas.height = H;
//每个文字的字体大小
var fontSize = 12;
//计算列
var colunms = Math.floor(W /fontSize);
//记录每列文字的y轴坐标
var drops = [];
//给每一个文字初始化一个起始点的位置
for(var i=0;i<colunms;i++){
drops.push(0);
}
//运动的文字
var str ="WELCOME TO WWW.ITRHX.COM";
//4:fillText(str,x,y);原理就是去更改y的坐标位置
//绘画的函数
function draw(){
context.fillStyle = "rgba(238,238,238,.08)";//遮盖层
context.fillRect(0,0,W,H);
//给字体设置样式
context.font = "600 "+fontSize+"px Georgia";
//给字体添加颜色
context.fillStyle = ["#33B5E5", "#0099CC", "#AA66CC", "#9933CC", "#99CC00", "#669900", "#FFBB33", "#FF8800", "#FF4444", "#CC0000"][parseInt(Math.random() * 10)];//randColor();可以rgb,hsl, 标准色，十六进制颜色
//写入画布中
for(var i=0;i<colunms;i++){
var index = Math.floor(Math.random() * str.length);
var x = i*fontSize;
var y = drops[i] *fontSize;
context.fillText(str[index],x,y);
//如果要改变时间，肯定就是改变每次他的起点
if(y >= canvas.height && Math.random() > 0.99){
drops[i] = 0;
}
drops[i]++;
}
};
function randColor(){//随机颜色
var r = Math.floor(Math.random() * 256);
var g = Math.floor(Math.random() * 256);
var b = Math.floor(Math.random() * 256);
return "rgb("+r+","+g+","+b+")";
}
draw();
setInterval(draw,35);
};在source/css文件夹的my.css中添加
canvas {
position: fixed;
right: 0px;
bottom: 0px;
min-width: 100%;
min-height: 100%;
height: auto;
width: auto;
z-index: -1;
}在layout文件夹中的layout.ejs中加入
<!-- 数字雨 -->
<canvas id="canvas" width="1440" height="900" ></canvas>
<script type="text/javascript" src="/js/DigitalRain.js"></script>数字雨会与归档图表冲突，看不惯可以不采用或者在主题config中关闭归档图表
添加加载条
将下载的pace文件放入hexo文件夹的source中
在主题文件夹的\layout_partial中打开head.ejs，在head中插入以下代码
<script src="/pace/pace.js"></script>
<link href="/pace/themes/加载条名称.css" rel="stylesheet" />另外不要忘记在robot.txt中添加
Disallow: /pace/防止爬虫抓取降低网站平均权重
