Hexo

Posted on

Welcome to Hexo! This is your very first post. Check documentation for more info. If you get any problems when using Hexo, you can find the answer in troubleshooting or you can ask me on GitHub.

Quick Start

Create a new post

1
$ hexo new "My New Post"

More info: Writing

Run server

1
$ hexo server

More info: Server

Generate static files

1
$ hexo generate

More info: Generating

Deploy to remote sites

1
$ hexo deploy

More info: Deployment

Posted on Edited on

title: butterfly主题部署指南
date: 2025-08-09 13:22:39
tags:

hexo的butterfly主题美化，2024年初版

转载自：https://blog.csdn.net/JesseXW

先贴上butterfly主题作者的官方美化文档地址，如果有大佬比较会的可以直接看他的（不过部分功能可能用不了了）：
Butterfly 安裝文檔(一) 快速開始 | Butterfly

注意！！！如果发现配置不生效，请先执行 hexo clean，然后清除浏览器缓存试试。如果还是不行，请检查配置文件的缩进是否有问题！！！

1. 准备工作

1.1 安装butterfly

在hexo的根目录下键入以下命令：

1
npm install hexo-theme-butterfly

1.2 修改配置文件，应用butterfly主题

修改 _config.yml 中的 theme 属性为 butterfly。

1.3 安装插件

如果你没有 pug 以及 stylus 的渲染器，请下载安装：

在hexo根目录下键入以下命令：

1
npm install hexo-renderer-pug hexo-renderer-stylus --save

1.4 推荐操作，复制一份butterfly主题专用的配置文件

在 hexo 的根目录创建一个文件 _config.butterfly.yml，后续对butterfly主题的美化配置就在该配置文件下进行修改即可。

层级关系如下图所示：

1.5 设置一个图片存储目录

在 source 目录下新建一个 image 文件夹，方便后续存储展示用的相关图片（名字你可以随便取）

层级关系如下：

2. 网站资料配置

在 _config.yml 文件里配置！

对应效果如图：

3. 导航栏配置

这里我直接copy展示用的代码了（毕竟完全不会）

1
2
3
4
5
6
7
8
9
10
11
12
13
14
nav:
  logo: /image/test.gif
  display_title: true
  fixed: false # fixed navigation bar
post_asset_folder: true
menu:
  首页: / || fas fa-home
  时间轴: /archives/ || fas fa-archive
  标签: /tags/ || fas fa-tags
  分类: /categories/ || fas fa-folder-open
  清单||fa fa-heartbeat:
    音乐: /music/ || fas fa-music
    照片: /Gallery/ || fas fa-images
    电影: /movies/ || fas fa-video

效果（搜索是额外配的，后面会说）：

4. 修改头像

将你喜欢的头像复制到之前配置的image文件夹里，路径如图所示：

然后在你复制出来的主题配置文件，也就是  _config.butterfly.yml 中添加如下配置：

1
2
3
4
#头像
avatar:
  img: /image/miku.jpg
  # effect: true # 头像会一直转，转的贼快，太鬼畜了

5. 顶部图设置

代码如下：

1
2
3
4
#顶部图
index_img: /image/miku.jpg
default_top_img: /image/miku.jpg
index_top_img_height: 400px #顶部图高度

效果：

tips：

  1. 感觉400px差不多了，或者默认就是全屏，但是全屏得往下拉才能看见博客。对于萌新不是很友好，我第一次进就是发现找半天找不到博客在哪
  2. 图片不要被宽屏误导了，请选择竖屏展示的图片，且清晰度越高越好（不然就是糊的）
  3. 经过观察，设置为400px时，展示的图片位置大概就在中间，所以最好选择你最想展示的部分为中间的图片~

6. 统计功能

推荐使用百度的api，首先你需要到百度统计官网申请id：

百度统计——一站式智能数据分析与应用平台

具体咋申请我忘了……自己多找找看吧 

问号后面的代码就是id，在 _config.yml 中添加如下配置

1
baidu_analytics: 你的id

7. 运行时间

 代码如下：

1
2
3
runtimeshow:
  enable: true
  publish_date: 1/4/2024 00:00:00

publish_date 就是你博客的创建时间，格式是 日/月/年 

效果：

8. 本地搜索

在主题配置文件下 _config.butterfly.yml 加入如下代码：

1
2
3
4
5
6
7
8
9
local_search:
  enable: true
  # Preload the search data when the page loads.
  preload: false
  # Show top n results per article, show all results by setting to -1
  top_n_per_article: 1
  # Unescape html strings to the readable one.
  unescape: true
  CDN:

效果：

9. 背景特效

详见官方文档：Butterfly 安裝文檔(四) 主題配置-2 | Butterfly

我的博客选的是动态彩带，代码如下：

1
2
3
canvas_fluttering_ribbon:
  enable: true
  mobile: false # false 手机端不显示 true 手机端显示

10. 鼠标点击特效

目前官方文档中鼠标点击特效的文字特效已无法使用（截至2024/1/18），目前我的博客采用的是爱心效果，代码如下：

1
2
3
4
# 点击出现爱心
click_heart:
  enable: true
  mobile: false

11. 网站副标题（循环打字特效）

添加如下代码即可（速度我已经进行了相应调整，您可以根据自己的喜好进行修改）：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
# 主页subtitle
subtitle:
  enable: true
  # Typewriter Effect (打字效果)
  effect: true
  startDelay: 300 # time before typing starts in milliseconds
  typeSpeed: 200 # type speed in milliseconds
  backSpeed: 800 # backspacing speed in milliseconds
  # loop (循环打字)
  loop: true
  # source 调用三方服务
  # source: false 开关调用
  # subtitle 会先显示 source , 再显示 sub 的內容
  source: true
  # 如果关闭打字效果，subtitle 只会显示 sub 的第一行文字
  sub:
    - 自小刺头深草里 , 而今渐觉出蓬蒿
    - 时人不识凌云木 , 直待凌云始道高

效果：

12. 页面加载动画

在主题配置文件 _config.butterfly.yml 加入以下代码即可：

1
2
3
4
5
#加载动画
preloader:
  enable: true
  source: 1 #可选值1=fullpage或2=progress bar，可查看https://codebyzach.github.io/pace/
  pace_css_url:

效果：

这个加载动画是butterfly默认的，目前在百度上没有找到可以直接使用的加载动画代码或url，只能凑合着用了，呃呃。

13. 池塘养鱼

在主题配置文件 _config.butterfly.yml 加入以下代码即可：

1
2
3
4
5
6
inject:
  head:

  bottom:
       - <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>
       - <script src="https://cdn.jsdelivr.net/gh/xiabo2/CDN@latest/fishes.js"></script>

有时候会遇到cdn解析失败，导致鱼塘加载不出来，建议还是以js文件格式本地引入，操作方法见下👇👇👇

13.1 在 source 目录下新建一个 styles 文件夹，用于存放相关文件

层级如下：

13.2 添加如下两个文件

注意：这两个文件的目录是基于我设置的styles目录下，如果你的文件夹名称是你自己设置的，请同步修改文件中涉及到的文件引用地址路径！！！

文件一：fish-base.js

1
// 省略，内容同原文

文件二：fish.js

1
// 省略，内容同原文

13.3 在主题配置文件下引入这两个文件

代码如下：

1
- <script src="/styles/fish.js"></script>

一样也得引入 jquery：

1
- <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>

层级关系如图所示：

14. 渐变色设置

在styles目录下新建一个 main.css 文件，键入以下代码：

1
/* 省略，内容同原文 */

同样，也需要在主题配置文件中引入这个css文件：

1
- <link rel="stylesheet" href="/styles/main.css">

层级关系如下图所示：

15. 浏览器图标修改

先找一个你喜欢的图标，注意格式需为32*32。可以从阿里的矢量图库中下载自己喜欢的：

iconfont-阿里巴巴矢量图标库

保存后放在image文件夹内（或者你自己自定义存图片的文件夹）：

 在你的主题配置文件内添加如下代码即可：

1
favicon: /image/动物.png

 效果如图所示：

16. 添加域名备案信息（butterfly主题）

在你的主题配置文件下加入以下代码：

1
2
3
4
5
6
footer:
  owner:
    enable: true
    since: 2024
  custom_text: <img src="https://haiyong.site/img/icp.png"><a href="https://beian.miit.gov.cn/#/Integrated/index" style="color:black" target="_blank">xICP备xxx号-1(你的icp备案号)</a>
  copyright: true

17. nginx配置监听转发

安装好后加入如下配置，如果有的话直接替换就行了：

1
2
3
4
5
6
7
8
9
10
11
12
server{
  listen 80; # 监听的端口
  server_name  xxxx; # 监听的地址，相当于就是你的域名地址
  index  index.php index.html index.htm;

  location / {
    proxy_pass xxxx; # 转发地址，带上端口号
    proxy_set_header Host $proxy_host; # 修改转发请求头，让8080端口的应用可以受到真实的请求
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
  }
}

18. 搬运自己的csdn文章到hexo

百度一搜一大堆，这里自己简单总结下：

18.1 获取文章信息

打开自己写的文章，打开开发者模式（F12），搜索article_content：

18.2 将复制的文章信息转换为md格式

进入下方网站，按照序号操作，最后转换的文件不用下载，可以直接全选复制到typora里操作。

markdown编辑器 - 在线工具

18.3 对于图片的处理

csdn是有防盗链的，所以你直接复制粘贴放到hexo上图片是加载不出来的。

方法一：另存为后复制粘贴（超级无脑）

方法二：结合之前我写的文章

腾讯云图床（对象存储）+typora+picgo实现图片一键上传-CSDN博客

全自动上传，记得开一下这个设置，会自动进行url替换

18.4 图片压缩

可以使用tx云对象存储自带的压缩，也可以自己手动压缩成webp格式。步骤如下：

Online PNG to WebP image converter

webp的展示效果还是不错的，体积压缩了不少但清晰度还是挺能打的。

后面对该图片替换就可以了

Posted on Edited on

在Linux中，系统更新和升级是维护系统安全性和功能性的重要任务。这通常涉及更新软件包、内核和系统工具。不同的Linux发行版有不同的包管理系统，以下是一些常见发行版中进行系统更新和升级的方法：

1. Debian/Ubuntu 系统

使用 apt 包管理器进行更新和升级。

  1. 更新软件包列表：

    1
    sudo apt update

    这个命令会从配置的软件仓库中获取最新的软件包信息。

  2. 升级所有已安装的软件包：

    1
    sudo apt upgrade

    这个命令会安装所有可用的更新，但不会删除任何软件包。

  3. 安装新版本的内核：
    如果系统提供了新版本的内核，可以使用 apt 进行安装：

    1
    sudo apt install linux-image-generic

    替换 linux-image-generic 为特定版本的内核，如果有的话。

  4. 清理不再需要的软件包：

    1
    sudo apt autoremove

    这个命令会删除那些被安装为其他软件包依赖但现已不再需要的软件包。

2. Red Hat/CentOS 系统

使用 yum 或 dnf 包管理器进行更新和升级。

  1. 更新软件包列表：

    1
    sudo yum check-update

    或者，如果你的系统使用 dnf：

    1
    sudo dnf check-update

    这些命令会检查可用的更新。

  2. 升级所有已安装的软件包：

    1
    sudo yum update

    或者使用 dnf：

    1
    sudo dnf update

    这些命令会安装所有可用的更新。

  3. 安装新版本的内核：
    通常，Red Hat/CentOS 系统会通过正常的软件包更新流程提供新的内核。如果需要手动安装，可以搜索并安装特定的内核软件包：

    1
    sudo yum install kernel

    或者使用 dnf：

    1
    sudo dnf install kernel

  4. 清理缓存：

    1
    sudo yum clean all

    或者使用 dnf：

    1
    sudo dnf clean all

    这些命令会清理缓存中的软件包数据，释放磁盘空间。

Posted on Edited on In

引用不良林博客

视频教程

AnyTLS 协议介绍

AnyTLS 是一个试图缓解 嵌套的 TLS 握手指纹 (TLS in TLS) 阻断问题的代理协议。anytls-go 是该协议的 Go 语言参考实现。

主要特点

  • 灵活的分包和填充策略
  • 支持连接复用，降低代理延迟
  • 配置简洁易懂

支持 AnyTLS 协议的代理工具

1. sing-box

  • 项目地址：SagerNet/sing-box
  • 注：同时包含 anytls 协议的服务端和客户端实现。

2. mihomo (原 Clash Meta)

  • 项目地址：MetaCubeX/mihomo
  • 注：同时包含 anytls 协议的服务端和客户端实现。

3. Shadowrocket (小火箭)

  • 客户端版本：Shadowrocket 2.2.65+
  • 注：实现了 anytls 协议的 iOS 客户端。

4. NekoBox For Android

搭建方式

方法一：通过 anytls-go 官方程序

1. 服务端部署

1
2
3
4
5
6
7
8
# 启动服务端监听 8443 端口，设置您的密码
./anytls-server -l 0.0.0.0:8443 -p 您的密码

# 后台静默运行
nohup ./anytls-server -l 0.0.0.0:8443 -p 您的密码 > /dev/null 2>&1 &

# 结束后台进程
pkill -f anytls-server

2. 客户端运行

1
./anytls-client -l 127.0.0.1:1080 -s 服务器IP:8443 -p 您的密码

方法二：通过 mihomo 部署

1. 生成自签证书

1
openssl req -x509 -newkey ec:<(openssl ecparam -name prime256v1) -keyout "./server.key" -out "./server.crt" -days 36500 -nodes -subj "/CN=bing.com"

2. 编写 config.yaml 配置文件

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
listeners:
- name: anytls-in-1
  type: anytls
  port: 8443
  listen: 0.0.0.0
  users:
    username1: 您的密码1
    username2: 您的密码2
  certificate: ./server.crt
  private-key: ./server.key
  padding-scheme: |
   stop=8
   0=30-30
   1=100-400
   2=400-500,c,500-1000,c,500-1000,c,500-1000,c,500-1000
   3=9-9,500-1000
   4=500-1000
   5=500-1000
   6=500-1000
   7=500-1000

3. 启动指令

1
2
3
4
5
6
7
8
# 启动 mihomo
./mihomo -d ./

# 后台运行
nohup ./mihomo -d ./ > /dev/null 2>&1 &

# 结束进程
pkill -f mihomo

协议背景与反馈分享

对于稳定要求比较高的用户建议自己搭建。

目前网络上几种主流协议的被封锁反馈（基于过去两年的统计）：

  • SS (Shadowsocks) 节点：在普通 VPS 上搭建使用，大概率极短时间内（第二天）就会被封锁 IP。
  • VMess + WS (Websocket) 节点：容易被精确识别并封锁端口，需要频繁更换端口，目前已不推荐使用。
  • VLESS + Vision 节点：近期有部分用户反馈被阻断。排查后发现多是因为免费证书域名（如 nip.io）被防火墙直接污染，与协议本身关联不大。
  • VLESS + Vision + Reality 节点：表现最稳定，几乎没有被封锁的反馈。如果偶尔遇到白名单地区阻断，建议将目标域名修改为大厂域名。

TLS in TLS 的特征缓解

“TLS in TLS” 指在加密隧道里传输另一个加密隧道，该流量指纹目前极易被防火墙识别。AnyTLS 通过自定义填充机制来消除该特征。

与传统的 Vision流控（采用固定的数据包开头字节填充）相比，AnyTLS 支持自定义 padding 填充参数。用户可以灵活设定填充的数据包数量、每个包的字节范围，极大增加了防火墙特征分析的难度。

0%