Blog

我的一些blog常用小操作

自己日常操作的一些小命令和插件。

bat启动 hexo 本地服务

前提条件：已完成博客搭建。

@echo off
start D:\Program" "Files\Git\git-bash.exe --cd=D:/blog/blog -c "hexo clean && hexo g && hexo s"
  1. 新建后缀为bat的脚本文件
  2. 复制以上命令粘贴（注意修改路径 ），保存
  3. 双击此脚本运行的结果相当于在你的 blog 路径下右键 “Git Bash Here” 并输入 “hexo clean && hexo g && hexo s” 运行.

bat 推送至 github

前提条件：已完成博客搭建和推送github的设置。

@echo off
start D:\Program" "Files\Git\git-bash.exe --cd=D:/blog3/blog -c "hexo clean && hexo g && hexo d && hexo s"
  1. 新建后缀为bat的脚本文件
  2. 复制以上命令粘贴（注意修改路径 ），保存
  3. 双击此脚本运行的结果相当于在你的blog路径下右键 “Git Bash Here” 并输入 “hexo clean && hexo g && hexo d && hexo s” 运行（如果只输入 “hexo clean && hexo g && hexo d “ ，当命令执行完后会自动关闭命令窗口，无法得知推送是否成功，所以后边加”hexo s“，运行完成后确认推送成功，Ctrl+C结束即可）

文章页图片放大（灯箱效果）

相关链接：https://github.com/fancyapps/fancybox

  1. 添加 js/css 到网站代码中，每个博客的存放代码的文件和位置可能不一样，有的是在 styl 文件中，有的可能在 EJS/PUG/SWIG 文件中，我使用的模版是在主题目录下的 _config.yml 文件中
css:
  - https://cdn.jsdelivr.net/gh/fancyapps/fancybox@3/dist/jquery.fancybox.min.css
js:
  - https://cdn.jsdelivr.net/gh/fancyapps/fancybox@3/dist/jquery.fancybox.min.js
  - https://cdn.jsdelivr.net/npm/jquery@3/dist/jquery.min.js
  1. 在 .md 文件里插入图片，添加代码
<a data-fancybox="gallery" href="big_1.jpg">
  <img src="small_1.jpg">
</a>

# 其中 big_1.jpg 和 small_1.jpg 可以是一致的，可以设置 width 参数来设置网页图片显示为小图。例如:
<a data-fancybox="gallery" href="https://i.loli.net/xxxxx.jpg">
<img src="https://i.loli.net/xxxxx.jpg" width="61.8%" />
</a>

404 页面

相关链接：https://www.qq.com/404/

虽然 blog 网站简单，访问出现 404 页面机会极少（除非在网址栏乱输入），但是还是操作一下。

具体设置点上面网址。

  • 安装插件
npm install hexo-abbrlink --save
npm install eslint@4.x babel-eslint@8 --save-dev
  • 修改网站根目录配置文件 _config_yml
  permalink: posts/:abbrlink.html  
  abbrlink:
      alg: crc32
      rep: hex
  • alg 和 rep 不同组合生成的链接
crc16 & hex
https://xx.github.io/posts/1234.html

crc16 & dec
https://xx.github.io/posts/12345.html
crc32 & hex
https://xx.github.io/posts/12345678.html

crc32 & dec
https://xx.github.io/posts/123456789a.html

hexo g 生成后，md 文件的 Front-matter 增加 abbrlink 属性，值为生成的 ID 链接，发布文章后文章链接不随改变文章内容而改变。