blog基本操作

新建文件

# 操作目录-博客根目录
进入Git Bash Here>
hexo new <文件名>
# 例如 新建HelloWorld.md 在_posts目录下
hexo new "HelloWorld"

图像存储设置

检查该md的偏好设置和格式下的图像–>设置图像根目录为source文件夹

1 2	# 设置typora图像位置../img/ 生成静态文件根目录的/img/会与模板/sources/下的/img/合并.

常用Bash命令

# 部署到本地默认端口 通过默认端口访问 例如:http://localhost:4000/访问
hexo s
# 生成静态页面
hexo g
# 清理缓存
hexo clean
# 部署到远程
hexo d
# 常用多命令操作
hexo clean && hexo g && hexo d

根目录下 _config.butterfly.yml

1
2
3

# 设置主页top图片
# 设置默认页面横幅 
default_top_img: img/system/default.jpg

根目录下_config.yml
1
# 设置本地搜索

功能添加

参考博客

音乐播放器切换页面不断点

参考完上面的吸底aplyer音乐播放器,只需要打开主题配置文件[blog/_config.butterfly]的选项

1 2	pjax: enable: true

Butterfly添加全局吸底Aplayer教程 | Butterfly

添加侧边栏时钟,转自安知鱼

如果有安装其他时钟插件且发生冲突,在博客根目录( blog )下打开终端,运行一下指令
1
2
# 卸载原版电子钟例如:安装hexo-butterfly-clock
npm uninstall hexo-butterfly-clock
安装插件,在博客根目录( blog )下打开终端,运行以下指令:
1
npm install hexo-butterfly-clock-anzhiyu --save

添加配置信息,在站点配置文件_config.yml 或者主题配置文件_config.butterfly.yml中添加,以下为_config.yml中示例

electric_clock:
  enable: true # 开关
  priority: 5 #过滤器优先权
  enable_page: all # 应用页面
  exclude:
  # - /posts/
  # - /about/
  layout: # 挂载容器类型
    type: class
    name: sticky_layout
    index: 0
  loading: https://cdn.cbd.int/hexo-butterfly-clock-anzhiyu/lib/loading.gif #加载动画自定义
  clock_css: https://cdn.cbd.int/hexo-butterfly-clock-anzhiyu/lib/clock.min.css
  clock_js: https://cdn.cbd.int/hexo-butterfly-clock-anzhiyu/lib/clock.min.js
  ip_api: https://widget.qweather.net/simple/static/js/he-simple-common.js?v=2.0
  qweather_key: # 和风天气web服务key
  gaud_map_key: # 高得地图web服务key
  default_rectangle: false # 开启后将一直显示rectangle位置的天气，否则将获取访问者的地理位置与天气
  rectangle: 112.982279,28.19409 # 获取访问者位置失败时会显示该位置的天气，同时该位置为开启default_rectangle后的位置

星空背景和流星特效

在[blog]\themes\source\js 目录下新建universe.js 输入:

1
2

function dark() {window.requestAnimationFrame=window.requestAnimationFrame||window.mozRequestAnimationFrame||window.webkitRequestAnimationFrame||window.msRequestAnimationFrame;var n,e,i,h,t=.05,s=document.getElementById("universe"),o=!0,a="180,184,240",r="226,225,142",d="226,225,224",c=[];function f(){n=window.innerWidth,e=window.innerHeight,i=.216*n,s.setAttribute("width",n),s.setAttribute("height",e)}function u(){h.clearRect(0,0,n,e);for(var t=c.length,i=0;i<t;i++){var s=c[i];s.move(),s.fadeIn(),s.fadeOut(),s.draw()}}function y(){this.reset=function(){this.giant=m(3),this.comet=!this.giant&&!o&&m(10),this.x=l(0,n-10),this.y=l(0,e),this.r=l(1.1,2.6),this.dx=l(t,6*t)+(this.comet+1-1)*t*l(50,120)+2*t,this.dy=-l(t,6*t)-(this.comet+1-1)*t*l(50,120),this.fadingOut=null,this.fadingIn=!0,this.opacity=0,this.opacityTresh=l(.2,1-.4*(this.comet+1-1)),this.do=l(5e-4,.002)+.001*(this.comet+1-1)},this.fadeIn=function(){this.fadingIn&&(this.fadingIn=!(this.opacity>this.opacityTresh),this.opacity+=this.do)},this.fadeOut=function(){this.fadingOut&&(this.fadingOut=!(this.opacity<0),this.opacity-=this.do/2,(this.x>n||this.y<0)&&(this.fadingOut=!1,this.reset()))},this.draw=function(){if(h.beginPath(),this.giant)h.fillStyle="rgba("+a+","+this.opacity+")",h.arc(this.x,this.y,2,0,2*Math.PI,!1);else if(this.comet){h.fillStyle="rgba("+d+","+this.opacity+")",h.arc(this.x,this.y,1.5,0,2*Math.PI,!1);for(var t=0;t<30;t++)h.fillStyle="rgba("+d+","+(this.opacity-this.opacity/20*t)+")",h.rect(this.x-this.dx/4*t,this.y-this.dy/4*t-2,2,2),h.fill()}else h.fillStyle="rgba("+r+","+this.opacity+")",h.rect(this.x,this.y,this.r,this.r);h.closePath(),h.fill()},this.move=function(){this.x+=this.dx,this.y+=this.dy,!1===this.fadingOut&&this.reset(),(this.x>n-n/4||this.y<0)&&(this.fadingOut=!0)},setTimeout(function(){o=!1},50)}function m(t){return Math.floor(1e3*Math.random())+1<10*t}function l(t,i){return Math.random()*(i-t)+t}f(),window.addEventListener("resize",f,!1),function(){h=s.getContext("2d");for(var t=0;t<i;t++)c[t]=new y,c[t].reset();u()}(),function t(){document.getElementsByTagName('html')[0].getAttribute('data-theme')=='dark'&&u(),window.requestAnimationFrame(t)}()};
dark()

在[blog]\themes\source\css\ 目录下新建universe.css 输入:

/* 背景宇宙星光  */
#universe{
  display: block;
  position: fixed;
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: -1;
}

在 [blog]\_config.butterfly.yml 的 inject 配置项中 bottom 下填入：(行前的+要去掉哦!!!)

# 插入代码到头部 </head> 之前 和 底部 </body> 之前
inject:
  bottom:
+    # 星空背景
+    - <canvas id="universe"></canvas>
+    - <script defer src="/js/universe.js"></script>

在 [blog]\_config.butterfly.yml 的 inject 配置项中 head 下填入：(行前的+要去掉哦!!!)

inject:
  head:
+    ## 星空背景
+    - <link rel="stylesheet" href="/css/universe.css">

修改默认主题 `light`or`dark`

在[blog]\_config.butterfly.yml的meraid按如下配置:

mermaid:
  enable: false
  # built-in themes: default/forest/dark/neutral
  theme:
    light: light
    dark: default

昼夜转换动画

图像设置

头像公共资源
1
https://www.gx8899.com/
图片
1

删除文章

删除文件夹source/_posts下目标markdown文章
删除.deploy_git文件夹
命令行执行hexo clean后,再执行hexo s部署到本地,hexo g部署到服务器

hexo命令丢失

首先检查node 、npm版本

node -v和npm -v，出现版本则为正常
第一步骤如果正常那么就是环境变量未配置识别，右键点击【此电脑】选择【属性】，依次选择【高级系统设置】-【环境变量】选择【系统变量】选择系统变量 Path，将 node_modules 下的 .bin 文件路径添加到 Path 里面

要添加到 Path 里面的是与 _config.yml 在同一个目录的 node_modules 文件夹！
环境变量添加好了之后重新打开 git 即可运行 hexo 命令，如果此时仍然无法执行 hexo 命令，那就只能拿出终极绝招了，运行命令 npm install hexo-cli -g 重新安装 hexo 即可！