作者：也被放进河川（hechuan4@outlook.com）

关于爪云 (ClawCloud)

官方地址： https://ap-northeast-1.run.claw.cloud/signin

使用注册时间超过 180 天 的 GitHub 账号登录，每月可获赠 $5 额度 用于部署容器。虽然额度不多，但如果合理分配资源，完全可以。

痛点

• 名额限制： 免费计划最多只能部署 4 个 容器。如果分开部署 OpenList、Twikoo、Debian、图床等服务，名额很快就会用尽。
• 数据风险： 容器偶尔会出现停止运行的情况，且存在数据丢失风险。

为了突破名额限制并解决备份问题，我们可以

• 制作一个基于 Debian 的通用镜像，内部预装常用环境。
• 多服务并存： 将 OpenList、Komari 等 Go 语言或其他二进制程序全部塞进这一个 Debian 容器中运行。
• 多端口映射： 爪云控制台支持放行多个端口并绑定域名，利用这一特性，一个容器即可支撑多个 Web 服务。
• 持久化与备份： 挂载持久化数据卷存放程序，防止重启后数据重置；同时利用 Rclone 实现定时数据备份。

解决方案

我制作了一个包含常用工具的 Debian 镜像，方便大家参考：

• GitHub 仓库： https://github.com/hechuan4/my-debian
• Docker Hub 镜像： https://hub.docker.com/r/huochuan/my-debian

通过这种方式，原本需要占用 3 个名额的服务现在只需 1 个容器即可搞定

小贴士： 建议务必挂载数据卷（Volume），并将 Rclone 备份脚本加入 Crontab，确保核心数据万无一失。

本文2026-03-31首发于也被放进河川，最后修改于2026-03-31

本博客所有文章除特别声明外，均采用 BY-NC-SA 许可协议。转载请注明出处！

作者：也被放进河川（hechuan4@outlook.com）

硬盘空间不够 资源存储的邪修方法

假如你整理/制作了 1t多的资源，但现在你没空间存了。

你制作的这个资源很精品，或者全网独一份。一单删掉，这份资源真的就全网消失了。

或许可以考虑制作成磁力种子，写好资源的特点内容。找几个发布站把这份资源分享出去。

吸引同好下载。让大家替你保存。

看资源大小和热门程度，你需要做种一段时间。就可以删掉了。

诚然这是很冒险的方法。你的资源可能永远取不回来了。

我称之为资源流浪记划。

此刻只要你的资源真的很精品独到，那这份资源某种意义上实现了赛博永生。

相信这份资源会躺在某人的硬盘上，直到多年后你有足够的空间重新下回来。

而且类似讯雷这类网盘应用，他门也会存一些热门的磁力资源在他们的服务器上。

前些天旧手机搞 termux 把系统搞坏了，只能重新刷系统。但刷机包官网删除了。去酷安找刷机包想到这个方法。

本文2026-03-29首发于也被放进河川，最后修改于2026-03-29

本博客所有文章除特别声明外，均采用 BY-NC-SA 许可协议。转载请注明出处！

作者：也被放进河川（hechuan4@outlook.com）

cloudflare官方工具 wrangler部署步骤，以 cloudflare-imgbed图床为例

但不知道有没有人跟我一样，不喜欢用一个平台去绑定另一个平台。

cloudflare pages 部署项目，纯静态的可以直接上传就行。而大多数项目是需要先构建，才能上传跑起来。

cloudflare pages 如果本地上传是不显示构建命令的。只有绑定 github 拉取的源码才能运行构建命令。

如

cloudflare-imgbed 是个很优秀的图床项目，可以直接白嫖 cloudflare pages 部署。存储可以对接 tg,r2,s3。让你的图床全白嫖。

官方教程写的很详细了：https://cfbed.sanyue.de/

但你要想本地上传源码，项目就需要先 npm install 构建。强迫症我又不想在本地电脑安装一大堆 nodejs 依赖插件构建项目。

于是打算让服务器构建项目。而 cloudflare官方工具 wrangler 可以命令行上传项目到 cf。

记下 Wrangler CLI 部署 步骤

如果你熟悉命令行，可以使用 Cloudflare 官方工具 Wrangler：

安装环境 Node.js

在 Linux 系统（如 Ubuntu、Debian、CentOS 等）上安装最新版 Node.js，不建议直接用 apt，因为官方源的版本通常非常陈旧。

以下是目前最推荐的两种方式：

方法一：使用 NodeSource 脚本安装（最快，适合生产环境）

这是直接从 Node.js 官方维护的二进制仓库安装最新版本的方法。

1. 清理旧版本（如果有）：

   sudo apt-get remove nodejs npm -y
   

2. 执行安装脚本（以目前的最新版 v24 为例，如需 LTS 请改为 v22）：

   curl -fsSL https://deb.nodesource.com | sudo -E bash -
   sudo apt-get install -y nodejs
   

3. 验证版本：

   node -v  # 应显示 v24
   

方法二：使用 nvm 安装（最灵活，强烈推荐）

nvm (Node Version Manager) 允许你在同一台机器上安装和切换多个 Node.js 版本，且不需要 sudo 权限。

1. 安装 nvm：

   curl -o- https://raw.githubusercontent.com | bash
   

   安装完后，请重启终端或运行 source ~/.bashrc 使其生效。

2. 安装最新版 Node.js：

   nvm install node    # 安装最新发布版 (Current)
   # 或者
   nvm install --lts   # 安装最新的长期支持版
   

3. 设置默认版本：

   nvm use node
   

安装 wrangler

1. 安装工具：在终端执行 npm install -g wrangler。

2. 登录账号：执行 wrangler login 授权你的 Cloudflare 账号。

3. 执行部署：进入源码目录，运行以下命令直接发布：

   npx wrangler pages deploy . --project-name 你的项目名
   

如果你在服务器（如 Linux VPS）或没有浏览器的环境下操作，不能使用会自动跳转页面的 wrangler login。你可以通过 API 令牌 (API Token) 的方式进行身份验证，这是最稳妥的无浏览器登录方案：

• 获取 API 令牌

1. 登录 Cloudflare 控制台。
2. 点击右上角头像 -> 我的个人资料 (My Profile)。
3. 点击左侧的 API 令牌 (API Tokens) -> 创建令牌。
4. 使用 “编辑 Cloudflare Workers” 模板（这个模板权限最高，涵盖了 Pages 和 KV）。
5. 在“账户资源”处选择你的账户，在“区域资源”处选择所有区域。
6. 点击 继续以显示摘要 -> 创建令牌，然后复制那串长字符。

• 在终端配置令牌

在你的终端（命令行）中，不要运行 wrangler login，直接通过设置环境变量来“登录”：

Linux / macOS (Bash/Zsh):

export CLOUDFLARE_API_TOKEN="刚才复制的令牌"

Windows (CMD):

set CLOUDFLARE_API_TOKEN=刚才复制的令牌

3. 验证登录状态

运行以下命令查看是否识别到了你的账户：

npx wrangler whoami

如果显示了你的账号邮箱和 ID，说明已经成功绕过浏览器完成登录。

4. 继续部署

现在你可以继续执行之前的部署命令了：

npx wrangler pages deploy . --project-name 你的项目名

构建 cloudflare-imgbed

在你的项目根目录下执行，生成用于发布的静态资源：

# 安装依赖
npm install

上面的部署命令，上传静态资源。

npx wrangler pages deploy . --project-name 你的项目名

关键配置：绑定 KV 与 兼容性标志

跟官方一样，看上面官方的教程。

踩坑

报错：

npx wrangler pages deploy . --project-name img
⛅️ wrangler 4.68.1 (update available 4.69.0)─────────────────────────────────────────────X [ERROR] 
A request to the Cloudflare API (/memberships) failed. Unable to authenticate request [code: 10001] If you think this is a bug, please open an issue at: https://github.com/cloudflare/workers-sdk/issues/new/choose🪵
Logs were written to

这个错误 code: 10001 表示 API 令牌（Token）校验失败。这通常是因为令牌过期、复制不全，或者环境变量在当前终端窗口中没有生效。

但实际并没有失效。

遇到的 [code: 10001] /memberships failed 报错是一个非常经典的问题。

即便你给 Token 配置了 Pages 编辑权限，Wrangler 在部署时仍会尝试访问 /memberships 接口来确认你的账户 ID。但因为你使用的是账户级 Token（Account Token），它没有权限访问这个用户级（User）的接口，从而导致认证失败。

快速修复方法：手动指定 Account ID

既然 Wrangler 自动获取 ID 失败，你只需要手动告诉它你的 Account ID 即可绕过这个报错。

根据你上一次 npx wrangler whoami 的输出，你的 Account ID 是：xxxx。

设置 Account ID 环境变量：

Windows (CMD):

set CLOUDFLARE_ACCOUNT_ID=xxxx

Linux / macOS (Bash/Zsh):

export CLOUDFLARE_ACCOUNT_ID=xxxx

再次尝试部署

本文2026-03-02首发于也被放进河川，最后修改于2026-03-02

本博客所有文章除特别声明外，均采用 BY-NC-SA 许可协议。转载请注明出处！

作者：也被放进河川（hechuan4@outlook.com）

红米note7 刷类原生 当软路由 随身wifi 免流热点机

前面已经把这台 红米note7 装上了 linux 容器，搭配 cloudflare Tunnels 隧道部署了博客和网盘等服务。

但其实一直是当 随身wifi 免流热点机 来用的。现在好像是叫 4g/5g cpe 的。

虽说是用 红米note7 来做的教程，但其实别的手机型号也是这个流程。

刷类原生（可选）

1. 解锁 bl

2. 刷第三方的橙狐 rec：https://orangefox.download/release/67f4350233482976f0b31229

3. 类原生 rom 下载地址：

   tg群组：https://t.me/RedmiNote7Official

   https://www.pling.com/p/1889410/

   https://www.pling.com/p/2094256/

   https://www.pling.com/p/1964434/

   https://mi.fiime.cn/FindROM

我刷了几个类原生

• 万花筒 安卓12 这个系统酷安说挺流畅的。养老包。但是原生不支持热点共享 vpn ，这个功能是什么，稍后再说。
• arrow 安卓12 这个用挺久的包，支持热点共享 vpn。略费电。
• lineage 安卓16 这个包用的有点卡。可能安卓16 的特效带着有点吃力。
• voltage 安卓16 这个包汉化不够，有些系统设置没汉化。
• Project-Infinity-X 安卓16 正在用这个包，感觉中规中矩。看下载的人挺多。 Project-Infinity-X-3.6-lavender-20.01.2026-GAPPS-UNOFFICIAL.zip

红米note7 也是吃上最新版安卓了。

无 root 共享 vpn

无 root 也是可以共享 vpn 的，clash 和 v2ray 都有这个功能。

1. 打开代理软件，启用 HTTP 代理，设置 端口号（如 7890）。
2. 手机 ip 在 wifi 界面查看。
3. 电脑连接手机热点后，打开设置>网络和Internet>代理>编辑代理服务器，填入手机 ip 和端口，如图
4. 手机端连接热点跟电脑端一样。

有 root 共享 vpn

• 如果你不打算刷类原生，国产原版系统大都是没有热点共享 vpn 功能的。需要用到 VPN Hotspot 这个软件，可以实现热点共享 vpn 功能。谷歌商店有下。

• 刷了上面几个类原生，系统原生支持热点共享 vpn 功能。

随身wifi 免流热点机

我的 bilibili 22卡 200g 免流。

现在 bilibili 2233免流卡纯冤种，早期承诺的福利全给你限制了。大会员从每日限量到只有免流卡的手机号才能领。之前绑定免流卡 b站号的几万积分全不能用了。

正常手机用免流软件免流后，分享的热点并不走免流。但免流软件其实也是 vpn 所以可以用同样的方法让免流机共享的热点也走免流。

我用的这两个软件。两个软件都行，都能免流。

踩坑：

之前用 arrow 系统的时候直接就能用免流软件加配置免流的，后面鼓捣 termux 的时候系统给刷坏了，所以去刷了 Project-Infinity-X 安卓16 系统，本想体验一下安卓16 的，没想到刷完不怎么卡。就养老了。

但发现免流软件配置好后，开启免流就没网，后面把数据上网里的 apn接入点 改成 3gnet 就行了。

手机改来电自启，改自供电。

鸽

旧手机利用的3篇文章

termux 安装 linux ubuntu

没钱续 vps，旧手机当服务器搭配 cf Tunnels 隧道，部署博客和网盘。发布公网。

红米note7 刷类原生 当软路由 随身wifi 免流热点机

本文2026-03-02首发于也被放进河川，最后修改于2026-03-02

本博客所有文章除特别声明外，均采用 BY-NC-SA 许可协议。转载请注明出处！

作者：也被放进河川（hechuan4@outlook.com）

没钱续 vps，旧手机当服务器搭配 cf Tunnels 隧道，部署博客和网盘。发布公网。

创业负债。吃饭都是问题了，vps 之前一只白嫖别人的用。现在到期了快。

博客虽然没写什么东西，但好在是 hugo 的静态博客，纯 html 文件。直接白嫖 cloudflare pages 或 github pages 就行。

但还有 openlist 网盘没地方部署了。还有几个 docker 服务。翻了翻网上也没什么免费的 docker 托管。

想到之前写过一篇旧手机用 termux 安装 linux 容器当服务器用的教程。

搭配 cloudflare Tunnels 隧道，可以把内网的服务发布到公网。

cloudflare 真是互联网大善人。

所以可以这样搞：

• 开机 -> Termux:Boot 自启 termux 软件。
• Termux 启动 -> 拉起 SSH -> 安装 Tmux 拉起 Debian。
• Debian 启动 -> 拉起 SSH -> 拉起 Cloudflared 启动 cf tunnels 隧道 -> 拉起 openlist 或其他服务。

注：

其实 Cloudflared 和 openlist 都可以直接装在 termux 宿主机里，没必要再装个 debian 容器。 只是我习惯用 termux 安装 debian，在 debian 里再装 openlist 等服务。所以下面的例子是以此为例的。你随你喜欢就好。两者无差别。不会了可以问 ai。

旧手机安装 linux 容器

看这篇

安装完 linux 容器后

配置 cloudflare Tunnels 隧道

安装 cloudflared 新建隧道的时候有安装部骤，照着安装就行。

记的配置 cloudflare tunels 隧道自启。在下面。

你可以通过以下命令来管理它

• 查看运行状态：service cloudflared status
• 停止隧道：service cloudflared stop
• 启动隧道：service cloudflared start
• 重启隧道（改了配置后常用）：service cloudflared restart

以 openlist 网盘为例

安装 openlist 网盘程序。

https://doc.oplist.org/guide/installation/manual

安装后因为手机的 linux 容器没有 systemd 不能以平常 vps 配置自启和后台运行。

后台运行有几种方案。screen 和 tmux

• 我习惯用 screen

# 安装 screen
apt install screen

# 运行服务时前面加上 screen 就行，测试下
# openlist 网盘运行命令就是
screen ./openlist server

以下是 screen 的常用指令汇总：

1. 会话管理（在普通终端输入）

• 新建会话：screen -S <名称>，创建一个指定名称的会话。
• 列出所有会话：screen -ls 或 screen -list。
• 恢复/重新连接会话：screen -r <名称或PID>。
• 强制离线并重连：screen -d -r <名称>，如果会话显示为 “Attached”，此命令可强制让其在别处离线并在当前窗口恢复。
• 清除死掉的会话：screen -wipe，用于清除那些已经停止但仍显示在列表中的会话。
• 彻底关闭会话：在会话中输入 exit 或使用 screen -X -S <名称> quit。

2. 常用快捷键（在 screen 会话中使用）

   所有快捷键都需要先按 Ctrl + a（前缀键）作为开头。

• 退出并保持后台运行 (Detach)：Ctrl + a, d。
• 新建窗口：Ctrl + a, c。
• 查看窗口列表：Ctrl + a, w

配置自启

虽然用 termux 安装了 debian 容器。但每次软件退出或手机重启后，要连接 termux 的 ssh 和启动 debian 容器都要手动启动。

在 Termux 中，由于它没有标准的 systemd 守护进程，systemctl 命令无法使用。

大体流程：

• 开机 -> Termux:Boot 自启 termux 软件。
• Termux 启动 -> 拉起 SSH -> 安装 Tmux 拉起 Debian。
• Debian 启动 -> 拉起 SSH -> 拉起其他服务。

开机自启 termux 软件

• 开机自启 termux 软件，用 Termux:Boot：https://wiki.termux.com/wiki/Termux:Boot

termux 自启 ssh 或其他服务。

两种配置自启方案

1. Termux-services 方案。我没试过，可以参考：https://ivonblog.com/posts/termux-services/
2. 这里以自启服务写在~/.bashrc为例。要杀掉行程再用kill指令停止。

• termux 的 ssh 服务自启。

  # 编辑启动脚本
  vim ~/.bashrc
  
  # 在文件的最末尾添加以下内容：
  pgrep -x sshd >/dev/null || sshd
  

• termux 自启 debian 容器。

  其实只要填加 sudo bash debian 命令就行。

  但这样每次打开 termux 就自动进入 debian 了。我是想打开 termux 后，后台自启 debian 不需要在前台运行。

  这里就需要用 tmux 或者 screen 软件。这里用 tmux 这个软件。

  # 安装 Tmux 在 Termux 中执行：
  pkg install tmux -y
  
  # 编辑启动脚本
  vim ~/.bashrc
  
  # 在文件的最末尾添加以下内容：
  # 打开 Termux 时，检查后台是否有 Debian 任务，没有则启动。
  if ! tmux has-session -t debian 2>/dev/null; then
      tmux new-session -d -s debian 'sudo bash debian'
  fi
  

• 贴上我的 termux 的 .bashrc 自启配置文件

  ~ $ cat ~/.bashrc
  # ssh 服务自启
  pgrep -x sshd >/dev/null || sshd
  
  # 自启 debian 容器
  if ! tmux has-session -t debian 2>/dev/null; then
      tmux new-session -d -s debian 'sudo bash debian'
  fi
  
  # 查看手机 IP
  ifconfig | grep "inet " | grep -v 127.0.0.1
  
  # Komari tmux 自启脚本
  if ! tmux has-session -t komari 2>/dev/null; then
      termux-wake-lock
      tmux new-session -d -s komari 'cd ~/komari && ./komari server -l 0.0.0.0:25774'
      echo "[Komari] 已在 tmux 新会话中后台启动"
  else
      echo "[Komari] 服务已在后台运行中"
  fi
  
  # Komari-Agent Root 自启脚本
  if ! tmux has-session -t komari-agent 2>/dev/null; then
      termux-wake-lock
      # 在 tmux 中启动会话，并调用 su -c 来执行 root 命令
      tmux new-session -d -s komari-agent "su -c 'cd /data/data/com.termux/files/home/komari && ./komari-agent -e http://127.0.0.1:25774 -t hyp57O3yAOxHZYj74ClxsJ'"
      echo "[Agent] 已在 tmux 中尝试以 Root 身份后台启动"
  else
      echo "[Agent] 服务已在后台运行中"
  fi
  ~ $
  

  如何操作这个后台自启的 Debian？

  配置完成后，当你打开 Termux，它是静默的。你可以通过以下指令管理它：也就是 tmux 的常用命令。

  • 查看后台是否在跑： tmux ls
  • 进入 Debian 界面： tmux attach -t debian (进去后你就在 root@localhost:# 提示符下了)
  • 退出（回到后台）而不关闭： 在进入 Debian 后，按下快捷键：Ctrl + B 然后松开，再按 D。
  • 彻底关闭后台任务： tmux kill-session -t debian

• 你是否想让 debian 容器也自启 ssh 呢。

  # 进入 debian 容器，操作跟在 termux 里一样。在 Debian 内部执行：
  vim ~/.bashrc
  
  # 在文件的最末尾添加以下内容：
  # 检查 ssh 服务状态，如果没运行则启动
  service ssh status > /dev/null 2>&1 || service ssh star
  

• 以及自启 cloudflare tunnels 隧道

  # 检查 cloudflared 服务状态，如果没运行则启动
  service cloudflared status > /dev/null 2>&1 || service cloudflared star
  

• 贴上我的 debian 自启脚本

# 检查 ssh 服务状态，如果没运行则启动
service ssh status > /dev/null 2>&1 || service ssh start

# 检查 cloudflared 服务状态，如果没运行则启动
service cloudflared status > /dev/null 2>&1 || service cloudflared start

# 自启 openlist
# 1. 自动清理已死掉的会话 (防止脚本误判)
screen -wipe > /dev/null 2>&1
# 2. 检查 openlist 会话是否存在
if ! screen -list | grep -q "\.openlist"; then
    # 确保进入绝对路径，避免相对路径报错
    cd ~/p.hechuan.me || exit
    
    # 3. 启动 screen
    # 建议加上 -L (开启日志) 或指定 shell 环境
    screen -d -m -S openlist ./openlist server
    
    echo "OpenList 已在 Screen 后台启动。"
else
    echo "OpenList 已经在运行中。"
fi

# Komari-Agent tmux 自启脚本
if ! tmux has-session -t Komari-Agent 2>/dev/null; then
    termux-wake-lock
    tmux new-session -d -s Komari-Agent 'cd ~/komari && ./komari-agent -e http://127.0.0.1:25774 -t OhmWv1Nr4nwkGL6XvqNwTt'
    echo "[Komari-Agent] 已在 tmux 新会话中后台启动"
else
    echo "[Komari-Agent] 服务已在后台运行中"
fi

手机改来电自启，改自供电。

鸽

旧手机利用的3篇文章

termux 安装 linux ubuntu

没钱续 vps，旧手机当服务器搭配 cf Tunnels 隧道，部署博客和网盘。发布公网。

红米note7 刷类原生 当软路由 随身wifi 免流热点机

本文2026-03-02首发于也被放进河川，最后修改于2026-03-02

本博客所有文章除特别声明外，均采用 BY-NC-SA 许可协议。转载请注明出处！

作者：也被放进河川（hechuan4@outlook.com）

国产 3D动漫 从夯到拉 (主观排名)

声明:个人主观排名

其实网文爽文改的 3D动漫，在我这都属于吃饭时看的剧。不用带脑子，看个爽。当吃饭时的配菜。

从建模，特效，剧情，制作组态度等角度给出排名。

本文所用到的工具：https://conghangdaola.com/

《凡人修仙传》

• 制作水平在线。虽然在国际上这种制作水平不够，但在国内看还是属于好的一批，也能看出制作组水平的慢慢提高。
• 剧情没魔改，前期有过改动，但被观众喷了，制作组看到观众喷后又改了回来。单从重制这一点就很曾加好感度。你能找出几个国内能给你重制的。记的他重制过好多集。
• 后面剧情也有过小改，但是改的观众一致叫好，且不影响主线。甚至弥补了原作。
• 后面制作水平提高，稳步向好，韩立结婴还大热了一阵。加上制作组听取观众反馈，给到夯，应该不会有太大质疑。

《仙逆》

• 仙逆本不该在顶级一栏的，属于人上人或 npc。完全是同行衬托。
• 制作水平有。画质，人物建模，特效，都属于中流水平。
• 网文的爽点都做了出来。
• 剧情没魔改，除了原作里有些过于露骨的描写，不可能给你做出来。
• 剧情不踩点，很多作品马上高潮了，他给你等下一集。仙逆是直接让你在这一集爽完。有些剧集也有过踩点出现，不知道是制作组被骂了还是如何，这种情况后面基本少出现了。
• 主角被屠了全族，这点在我这是完全可以弃剧的雷点。但考虑到原著都多少年前的作品了，也能接着看。
• 有种感觉，制作组或者带头的领导应该是仙逆网文的粉丝。有用心做。不过受限于原著题材以及制作组水平，上限也就在这了。
• 用中流的制作水平交了一份 80分的答卷。加上其他几部作品的衬托，给到顶级。

《牧神记》

• 《牧神记》可惜了，本来是可以给到夯的。
• 如果说以上都是爽文，就看个无脑爽，看完不过脑子。看到延康国师那，发现原来这部作品立意挺高。同时也无脑爽。
• 明显原著作者是想在网文爽文的基础上，写点什么东西出来。但很明显作者把握不住。(这里并非贬意，而是褒意。)
• 里面的台词，让我记忆犹新。“一个是批着宗教的国家，一个是批着国家的宗教”。“360堂对应世间360行”。以及新建第361堂，学堂。
• 无脑爽和立意高，本来有点相悖的，所以有的地方看着不是很合理。
• 比如主角几人去挑战楼兰黄金宫，主角境界低，对面境界高，然后对面的老大让手下压制境界到跟主角一样来打。明明这是生死之战，能明白是想表达为了公平才压制境界，但这可是生死之战，命不是最重要的？
• 制作组玄机科技用了太多 ai 生成了，追求新技术本没错。可导致很多画面看了出戏，尤其是前面的集数，ai 生成还没那么强，一眼就能看出是 ai 做的。甚至有的集快全是 ai 生成的了。太偷懒了。
• 但也有好处，ai 生成的场景确是够宏大，让你在手机的小屏幕上感受到玄幻小说描述的宏大的感觉。
• 后面 ai 发展的也快，很多 ai 生成的画面好多了。但无非是一眼看出 ai 或两眼看出 ai的区别。
• 里面的上古神语制作成用粤语替代。听着还挺有神性的，但可让那些粤语小鬼猖狂了一把，弹幕在那发粤语就是中国古代的语言。好在制组组估计看到了弹幕吵架，后面没再重复放。但也跟故事线还没讲到神那的剧情有关。
• 这部作品从一开始是《小鱼儿与花无缺》，9个师傅教主角功夫的开头模板。到丁真与他的动物朋友，主角像丁真，天天跟动物朋友玩。到延康国师。
• 该爽的地方爽，也有立意，制作用了 ai 生成，有好有坏，虽然 ai 生成的坏大于好，但可以给个顶级。

《沧元图》

• 前期场景太粗糙简陋，不像是工作室出品的成品动漫。像个人兴趣爱好做出来的。
• 好在后面经费有了，场景不再简陋。
• 建模中规中据。
• 特效独数一帜。这点可以单独说说，制作组有他们独到的理解与表达。主角的中国风特效确实帅，加分。
• 说到制作组有他们独到的艺术化表达。不得不说，有时候会弄巧成拙。比如名场面主角魔化，在那唱数鸭子，门前大桥下游过一群鸭，有画面了没有。我能理解为什么这么表达，但这种艺术行为是需要前期铺垫的。
• 以及背景音乐的蒙古喊麦，喊的时间太长了，有点尬了。弹幕也全在说这事，可见不是我一人觉的尬。
• 剧情有硬伤，主角老被利用，设套。以及莫名其妙的追杀，所有人都知道，唯独主角不知道的谜语人剧情。
• 综合来看，前期可以给到拉，后面场景建模好了加上特效以及独到的艺术化表达，给到npc。

《剑来》

• 除了建模好，别的说不上那好了。
• 剧情就俩字：磨叽。
• 所有人都想杀主角，主角惹到他了，要杀主角，主角帮过他，要杀主角，主角小时候救过他，要杀主角。
• 给所有要杀主角的人物都安排了看似合理的措词。
• 战力说白了也有点崩坏。
• 看似说了一堆圣贤道理，过于追求所谓意境。
• 看在建模好特效好，可以给到npc。但粉丝多，吹的挺多。给到人上人。

《吞噬星空》

• 各方面都不突出，个人感觉动漫是没做到预期的。
• 高中时看了小说，吞噬星空地球篇是写的不错的。单论小说，吞噬星空地球篇算是顶级，夺舍金角巨兽飞出地球后就很平常的打怪升级了。
• 建模一般，剧情还有魔改，动漫还有删剪。导致剧情不连贯。
• 加上高中情怀，给到 npc。

《完美世界》

• 主角像个傻子有没有感觉。
• 什么都吃吃吃。说是熊孩子，看着像个傻莽子。
• 特效建模也不出众。属于是吃饭看剧都不选他。
• 给到拉。

《斗破苍穹》

• 可惜了。
• 作者都说做的拉的。
• 斗破现在属于给新人练手的动漫作品吧。
• 有这么一种现象，当你发弹幕说别的动漫做的拉的时候，肯定有弹幕回怼你说：总比斗破强。
• 当别的动漫开始吵起来的时候，只要拉出斗破来。大家都开始一致骂斗破。
• 给到拉。

本文2026-02-11首发于也被放进河川，最后修改于2026-02-14

本博客所有文章除特别声明外，均采用 BY-NC-SA 许可协议。转载请注明出处！

作者：也被放进河川（hechuan4@outlook.com）

开源图床项目分享与对比

hugo这类静态博客的图片存储一直是个问题。

开源的图床一大堆，但实际体验下来，适合个人使用，部属方便，占用小且满足需求的图床还真没几个。

一直用的是 docker 部署的简单图床这个项目。

服务器即将到期，（服务器其实一直是白嫖别人的在用。）

结合这个贴子。【经验分享】几个开源图床项目的对比分享。

又加了几款图床测试。还有些经典的图床项目但不更新了，没放在内。

图床列表

使用体验

还是更倾向于 go 语言写的。

二进制文件直接运行，占用小。

兰空图床

• php 写的安装需要一大堆依赖，安装要半天，好在可以 docker 部署。
• 内存占用还好，但 docker 部署占用储存太多了，将进 1g 。
• 支持 s3 兼容对象存储，sftp，ftp，webdav 等。
• 开源版界面 ui 不算太旧，也不算太现代化。
• 开源版不更新了，付费版本适合商用，个人用不太适合。

简单图床2.0

一直用的是这个图床。能满足个人大部分需求。

• php写的，安装不需要太多依赖，可以 docker 部署。
• 内存占用不高，docker 版不算太大，260m。
• 不支持 s3 等一众后端存储协议。作者说不会支持。这也是想换掉他的原因之一。
• 界面 ui 有点旧。
• 图片访问路径不依赖数据库。这点是他很大的优点，其他图床基本都没这个功能，可以很方便迁移图片。

PixPro

• php 写的。
• 界面 ui 挺现代化。
• 还不能 docker 部署，没测试。

tg-telegram-imagebed

• 基于tg的图床，但要弄tg机器人什么的。
• 支持 s3 等后端存储协议。
• 优点支持tg群组上传，如果想从手机上传或者保存图片很合适，上传之后立刻返回链接很方便。
• 界面 ui 挺现代化的。
• docker 占用 500m。

CloudFlare-ImgBed

• 配置要求最高的一个图床。
• 部署完服务器的 cpu 和内存直接占满了。然后就卡了。
• docker 占用 560m。
• 界面 ui 挺好看的。
• 支持 s3 r2 兼容对象存储。不支持 webdav等。
• 虽然卡，但好在他支持 cloudflare 部署，可以不用自己的服务器部署。
• 加上白嫖 cloudflare 的 r2 存储服务，10g 免费空间，这样整个图床全是白嫖的。

cloudimgs

• 主要面向 nas 用户。
• 作者暂时没有计划对接后端存储

ImageFlow

nodeimage_clone

sapic(picbed)

• Python 写的。
• 内置支持本地、S3等对象存储，支持GitHub、Gitee（码云）。

不足：

• 图床管理暂时不能批量化；
• 基于redis的数据存储，虽响应快，但数据存储方面可能有些风险，请注意持久化及备份数据！
• 一个图床要用到 redis 有点臃肿了。
• 界面太老了。
• docker 占用 460m。

oneimg easyimg fast-image

这三个图床可以放到一起说。

应该都有用到 ai 生成。这三个看着很像。

oneimg和 fast-image 是 go 语言写的。占用小，二进制文件直接就能运行。是小鸡部署个人图床的首选。

easyimg有 docker 版，占用 160m。不算大。

只有 oneimg 支持 s3 兼容存储和 webdav。算是功能较全。但还有些小 bug。

总结

虽然图床项目很多，但一个占用小，方便部署，功能全，支持 s3 等后端存储的图床还真不多。

或许改学学 ai 写代码了。

本文2026-02-12首发于也被放进河川，最后修改于2026-02-12

本博客所有文章除特别声明外，均采用 BY-NC-SA 许可协议。转载请注明出处！

作者：也被放进河川（hechuan4@outlook.com）

网站修改记录

Reimu

主题改动

字体颜色

上下两种用一种就行,推荐直接暴露出来,下面这种

# 文件:themes\hugo-theme-reimu\assets\css\_variables.scss

  --color-default: #444;
改为
  --color-default: #000000;
效果:字体更黑

# 文件:themes\hugo-theme-reimu\assets\css\main.scss下

# 82行添加
$color-default: {{ default "#444" (index $params.internal_theme.light "--color-default") }};

# 文件:themes\hugo-theme-reimu\assets\css\_variables.scss下

# 16行改
  --color-default: #444;
# 为
  --color-default: #{$color-default};

# 之后改只需要改params.yml文件

internal_theme:
  light:
    --color-default: '#000000'

代码块

# params.yml文件

# 代码块颜色

internal_theme:
  lignt:
    --highlight-nav: "#F3F3F3"
    --highlight-scrollbar: "#d6d6d6"
    --highlight-background: "#F3F3F3"

# 代码块背景取消阴影模糊,感觉这样更简洁直观
# themes\hugo-theme-reimu\assets\css\partials\highlight.scss文件
# 删掉

    box-shadow: var(--shadow-card);
# 和
      box-shadow: var(--shadow-card-hover);

要将主题颜色修改为 Bilibili (哔哩哔哩) 的标志性粉蓝色调

原

internal_theme:
  light:
    --red-0: '#ff0000'
    --red-1: '#ff5252'
    --red-2: '#ff7c7c'
    --red-3: '#ffafaf'
    --red-4: '#ffd0d0'
    --red-5: '#ffecec'
    --red-5-5: '#fff3f3'
    --red-6: '#fff7f7'
    --color-red-6-shadow: 'rgba(255, 78, 78, 0.6)'
    --color-red-3-shadow: 'rgba(255, 78, 78, 0.3)'

现

  light:
    --red-0: '#00aeec'       # 深蓝色（用于悬停或强调） #007eb1
    --red-1: '#00aeec'       # B站标准品牌蓝（主色调）
    --red-2: '#40c5f1'       # 次级蓝色
    --red-3: '#7fdcf6'       # 浅蓝色
    --red-4: '#bfedfa'       # 极浅蓝
    --red-5: '#e5f7fd'       # 背景淡蓝
    --red-5-5: '#f1fbfe'     # 极淡背景色
    --red-6: '#f8fdff'       # 近白色背景
    --color-red-6-shadow: 'rgba(0,0,0,0)' # 蓝色阴影（深） 0, 174, 236, 0.6
    --color-red-3-shadow: 'rgba(0,0,0,0)' # 蓝色阴影（浅） 0, 174, 236, 0.3

示例

要将主题颜色修改为 Bilibili (哔哩哔哩) 的标志性粉蓝色调，我们需要将原本的红系（Red）变量替换为 B站经典的 “少女粉” 或 “电视蓝”。

在 2025 年的 UI 设计中，B站主要使用 #FB7299 作为主色调。以下是为你调整后的配置，将原有的红色阶替换为了过渡自然的 B站粉色系：

internal_theme:
  light:
    # Bilibili 风格粉色系（由深到浅）
    --red-0: '#E05D84'            # 深粉色（用于悬停）
    --red-1: '#FB7299'            # B站主色（正粉色）
    --red-2: '#FF8AAB'            # 次级粉
    --red-3: '#FFB3C6'            # 淡粉
    --red-4: '#FFD9E2'            # 极淡粉
    --red-5: '#FFF1F4'            # 浅粉背景
    --red-5-5: '#FFF7F9'          # 极浅背景
    --red-6: '#FFFFFF'            # 白色基准
    
    # 投影颜色调整（基于 B站粉）
    --color-red-6-shadow: 'rgba(251, 114, 153, 0.6)'
    --color-red-3-shadow: 'rgba(251, 114, 153, 0.3)'

    # 这里的变量名虽然叫 --red，但实际显示已变为 B站粉
    # 如果你想增加 B站蓝（#00AEEC）作为高亮，可以修改下面的部分变量
    --highlight-aqua: "#00AEEC"   # 将水蓝色改为 B站品牌蓝
    --highlight-blue: "#007AAB"   # 深蓝色

在 Hugo Reimu 主题中，要将默认的“灵梦红”改为 Bilibili 蓝，你需要调整 internal_theme 下的变量值。

以下是基于 Bilibili 官方品牌蓝（#00AEEC）调配的配色方案，你可以直接替换配置文件中的相应部分：

internal_theme:
  light:
    --red-0: '#007eb1'       # 深蓝色（用于悬停或强调）
    --red-1: '#00aeec'       # B站标准品牌蓝（主色调）
    --red-2: '#40c5f1'       # 次级蓝色
    --red-3: '#7fdcf6'       # 浅蓝色
    --red-4: '#bfedfa'       # 极浅蓝
    --red-5: '#e5f7fd'       # 背景淡蓝
    --red-5-5: '#f1fbfe'     # 极淡背景色
    --red-6: '#f8fdff'       # 近白色背景
    --color-red-6-shadow: 'rgba(0, 174, 236, 0.6)' # 蓝色阴影（深）
    --color-red-3-shadow: 'rgba(0, 174, 236, 0.3)' # 蓝色阴影（浅）
    
    --highlight-nav: "#fdfdfd"

在 Hugo 博客框架中，让菜单标签在新页面打开

  - name: travel
    url: "travel.moe"
    icon: f57e
    params:
      external: true  # 某些主题通过此参数识别外部链接并自动新窗口打开
      target: "_blank" # 显式指定目标

添加导航栏菜单

menu:
  - name: foreverblog
    url: "https://foreverblog.cn/go.html"
    icon: f197

themes\hugo-theme-reimu\i18n\zh-CN.yml

文件下添加

travelling: 开往
travel: 跃迁
foreverblog: 穿梭

i18n 是 Internationalization（国际化）的缩写

其命名源于首尾字母 “i” 和 “n” 之间共有 18 个字母

字体

# Font loading strategy
# Custom Font -> Google Fonts -> Local FallBack Font

# Custom Font
# v0.9.0 添加了 custom_font 配置用于定义自定义字体，其优先级最高：
custom_font:
  enable: false
  article:
    # - css: 
    #   name:  
    # - css: https://fontsapi.zeoseven.com/292/main/result.css # font css
    #   name: LXGW WenKai # font name
  code:

# https://fonts.google.com/
# Google Fonts, higher priority than local_font
font:
  enable: false
  article:
    # - Mulish
    # - Noto Serif SC
  code:
    # - Ubuntu Mono
    # - Source Code Pro
    # - JetBrains Mono

# Local FallBack Font
# v0.2.0 添加了 local_font 配置用于定义本机字体，其优先级比谷歌字体低：
local_font:
  article:
    - "-apple-system"
    - PingFang SC
    - Microsoft YaHei
    - sans-serif
  code:
    - Menlo
    - Monaco
    - Consolas
    - monospace

改动

local_font:

  code:
    - "Cascadia Code"
    - "JetBrains Mono" # 现代代码字体

配置建议与说明

• 性能考量：如果你开启了 custom_font 或 font，浏览器会从服务器下载字体文件，这可能会在初次加载时导致文字有短暂的“闪烁”或延迟显示。
• 代码字体 (code)：强烈建议使用 JetBrains Mono 或 Cascadia Code，它们带有连字特性且非常易读，配合你之前配置的 B 站蓝代码块，效果极佳。
• 避坑指南：如果你在 custom_font 中配置了 CSS，请确保链接是 HTTPS 的，否则在 2025 年主流浏览器中会因为“混合内容”安全策略被拦截，导致字体加载失败。

社交链接

添加 qq,travel,travelling,foreverblog

# themes\hugo-theme-reimu\assets\css\partials\sidebar.scss
# 填加,修改

@if index($social-keys, "qq") {
  .icon-qq {
    color: #00aeec;
  }
}

@if index($social-keys, "travel") {
  .icon-travel {
    color: #e77c8e;
  }
}

@if index($social-keys, "travelling") {
  .icon-travelling {
    color: #000001;
  }
}

@if index($social-keys, "foreverblog") {
  .icon-foreverblog {
    color: #000001;
  }
}

@if index($social-keys, "email") {
  .icon-email {
    color: #00aeec;
  }
}

@if index($social-keys, "bilibili") {
  .icon-bilibili {
    color: #00aeec;
  }
}

# themes\hugo-theme-reimu\assets\css\fontawesome.scss
# 172行添加

@if index($social-keys, "qq") or $triangle-badge-icon == "qq" {
  .icon-qq:before {
    content: "\f1d6";
  }
}

@if index($social-keys, "travel") or $triangle-badge-icon == "travel" {
  .icon-travel:before {
    content: "🛸";
  }
}

@if index($social-keys, "travelling") or $triangle-badge-icon == "travelling" {
  .icon-travelling:before {
    content: "🚇";
  }
}

@if index($social-keys, "foreverblog") or $triangle-badge-icon == "foreverblog" {
  .icon-foreverblog:before {
    content: "🛸";
  }
}

图标变大

# themes\hugo-theme-reimu\assets\css\partials\sidebar.scss

.sidebar-social-icon {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 29px;

  @if $icon_font {
    font: 24px $font-icon;
  } @else {
    font: 24px var(--font-icon);
  }

  transition: transform 0.2s;
  will-change: transform;

  &:hover {
    transform: scale(1.4);
  }
}

fontawesome

# themes\hugo-theme-reimu\assets\css\fontawesome.scss

.icon-pencil:before {
  font-family: var(--font-icon);
  content: "\f303";
}

.icon-calendar:before {
  font-family: var(--font-icon);
  content: "\f133";
  font-weight: 900;
}

2024/1/2 你好 hugo

更换 hugo 博客框架，stcak 主题，纯静态就是快。

//  ~\blog\assets\scss\custom.scss

//--------------------------------------------------
//链接三栏
@media (min-width: 1024px) {
  .article-list--compact.links {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr; //三个1fr即为三栏,两个1fr则为双栏,以此类推即可.
    background: none;
    box-shadow: none;
    gap: 1rem;

    article {
      background: var(--card-background);
      border: none;
      box-shadow: var(--shadow-l2);
      margin-bottom: 8px;
      border-radius: var(--card-border-radius);

      &:nth-child(odd) {
        margin-right: 8px;
      }
    }
  }
}

/* 归档页面两栏 */
@media (min-width: 720px) {
  .article-list--compact {
    display: grid;
    grid-template-columns: 1fr 1fr;
    background: none;
    box-shadow: none;
    gap: 1rem;

    article {
      background: var(--card-background);
      border: none;
      box-shadow: var(--shadow-l2);
      margin-bottom: 8px;
      border-radius: 16px;
    }
  }
}

.widget--toc {
    background-color: var(--card-background);
    border-radius: var(--card-border-radius);
    display: flex;
    flex-direction: column;
    color: var(--card-text-color-main);
    overflow: hidden;
    // display:inline-block;
    font-size: 16px;

    #TableOfContents {
        overflow-x: auto;
        ol,
        ul {
            margin: 10; 
            padding: 0;
        }
        ol {
            list-style-type: none;
            counter-reset: item;
            li:before {
                counter-increment: item;
                content: counters(item, ".") ". ";
                font-weight: bold;
                margin-right: 0px;
            }
        }
        & > ul {
            padding: 0 1em;
        }
        li {
            margin: 5px 20px;
            padding: 6px; 
            & > ol,
            & > ul {
                margin-top: 10px;
                padding-left: 6px;
                margin-bottom: -5px;
                & > li:last-child {
                    margin-bottom: 0;
                }
            }
        }
    }
}

docker run -d \
  -e LEAN_ID=huochuan-blog \
  -e LEAN_KEY=huochuan-blog-key \
  -e LEAN_MASTER_KEY=huochuan-blog-master-key \
  -p 8360:8360 \
  lizheming/waline

# docker-compose.yml
version: '3'

services:
  waline:
    container_name: waline
    image: lizheming/waline:latest
    restart: always
    ports:
      - 127.0.0.1:8360:8360
    volumes:
      - ${PWD}/waline/data:/app/data
    environment:
      TZ: 'Asia/Shanghai'
      SQLITE_PATH: '/root/waline/sqlite/app/data'
      JWT_TOKEN: 'huochuan'
      SITE_NAME: 'huochuan'
      SITE_URL: '64.176.35.191:8360'
      SECURE_DOMAINS: '64.176.35.191:8360'
      AUTHOR_EMAIL: 'hechuan4@outlook.com'

docker run -d --name waline -p 8360:8360 \
  -v /root/waline/data:/app/data \
  -e TZ="Asia/Shanghai" \
  -e JWT_TOKEN:'huochuan'\
  -e SQLITE_PATH:'/root/sqlite/app/data' \
  -e AUTHOR_EMAIL="hechuan4@outlook.com" \
  -e SITE_NAME="huochuan" \
  -e SITE_URL="64.176.35.191:8360" \
  -e SECURE_DOMAINS="hechuan.me" \
  --restart always \
  lizheming/waline:latest

docker run --name twikoo -e TWIKOO_THROTTLE=1000 -p 8686:8080 -v ${PWD}/data:/app/data -d imaegoo/twikoo

<script async src="//busuanzi.ibruce.info/busuanzi/2.3/busuanzi.pure.mini.js">
script>

<i class="powerby">
<span id="busuanzi_container_site_pv">
    访问量 - <span id="busuanzi_value_site_pv">span>
span> 
<span id="busuanzi_container_site_uv">
    访客数 - <span id="busuanzi_value_site_uv">span>人次
  span>
i>

docker run -d --name memos -p 5230:5230 \
  -v /root/memos:/var/opt/memos \
  neosmemo/memos:latest

// 头像旋转动画
.sidebar header .site-avatar .site-logo {
  transition: transform 1.65s ease-in-out; // 旋转时间
}

.sidebar header .site-avatar .site-logo:hover {
  transform: rotate(360deg); // 旋转角度为360度
}

// 代码块基础样式修改
.highlight {
  max-width: 102% !important;
  background-color: var(--pre-background-color);
  padding: var(--card-padding);
  position: relative;
  border-radius: 12px;
  margin-left: -7px !important;
  margin-right: -12px;
  box-shadow: var(--shadow-l1) !important;

  &:hover {
    .copyCodeButton {
      opacity: 1;
    }
  }
}

// light模式下的代码块样式调整
// 备份颜色#fff9f3,#fff9f3cc
[data-scheme="light"] .article-content .highlight {
  background-color: #F0EFEB;
}

[data-scheme="light"] .chroma {
  color: #ff6f00;
  background-color: #F0EFEB;
}

// 页面基本配色
:root {
  --body-background: #f2f2f2;
  --card-background: #DEDEDE;
  --pre-background-color: #fafafa;
  
  // 行内代码背景色
  --code-background-color: #f8f8f8;
  // 行内代码前景色
  --code-text-color: #e96900;

  // 全局顶部边距
  --main-top-padding: 30px;
  // 卡片间距
  --section-separation: 20px;
}

// 文章内容图片圆角阴影
.article-page .main-article .article-content {
  img {
    // 文章图片大小
	//max-width: 96% !important;
    height: auto !important;
    border-radius: 7px;
  }
}

$db->connect ('localhost','root','password','typecho');

<?php
$db= new mysqli();
$db->connect('localhost','root','password','typecho');

$prefix = "typecho";
$sql=<<<TEXT
select u.screenName author,url authorUrl,title,text,created,t2.category,t1.tags,slug from {$prefix}_contents c
left join
 (select cid,CONCAT('"',group_concat(m.name SEPARATOR '","'),'"') tags from {$prefix}_metas m,{$prefix}_relationships r where m.mid=r.mid and m.type='tag' group by cid ) t1
 on c.cid=t1.cid
 left join
(select cid,CONCAT('"',GROUP_CONCAT(m.name SEPARATOR '","'),'"') category from {$prefix}_metas m,{$prefix}_relationships r where m.mid=r.mid and m.type='category' group by cid) t2
on c.cid=t2.cid
left join ( select uid, screenName ,url from {$prefix}_users)  as u
on c.authorId = u.uid
TEXT;

$db->query("set character set 'utf8'");//读库
$res=$db->query($sql);
if($res){
    if($res->num_rows>0){

        while($r=$res->fetch_object()) {
            $_c=date('Y-m-d H:i:s',$r->created);
            $_t=str_replace('<!--markdown-->','',$r->text);
            $_a = str_replace(array('C#'),'CSharp',$r->tags);
            $_g = str_replace(array('C#'),'CSharp',$r->category);
            $_g = str_replace(array(','),'-',$_g);
            $_author = $r->author;
            if ($r->authorUrl != "" && $r->authorUrl != "http://www.typecho.org") {
                $_author = "<a href=\"{$r->authorUrl}\" rel=\"noopener\" target=\"_blank\">{$r->author}</a>";
            }
            $_tmp = <<<TMP
---
title: "$r->title"
categories: [$r->category]
tags: [$r->tags]
draft: false
slug: "$r->slug"
date: "$_c"
---

$_t

TMP;
            $file_name=$r->title;
           file_put_contents(str_replace(array(" ","?","\\","/" ,":" ,"|", "*" ),'-',$file_name).".md",$_tmp);
        }
    }
    $res->free();
}

$db->close();

---
title: "{{ replace .File.ContentBaseName "-" " " | title }}"
slug: "{{ replace .Name "-" " " | title }}"
description: 
date: {{ .Date }}
image: 
math: 
license: 
hidden: false
comments: true
---

? 年 你好 typecho

wordpress更新的太臃肿了，换typecho博客框架。

采用 typecho 博客框架，joe 主题，typecho 还是挺简洁的。

    <!-- PC侧栏社交信息 -->
    <?php if ($this->options->SocialInfo && (($this->options->SocialSwitch === 'on') || ($this->options->SocialSwitch === 'on2'))) : ?>
        <?php
        $SocialInfo = $this->options->SocialInfo;
        if ($SocialInfo) {
            $SocialInfo_arr = explode("\r\n", $SocialInfo);
            if (count($SocialInfo_arr) > 0) {
                for ($i = 0; $i < count($SocialInfo_arr); $i++) {
                    $SocialTitle = explode("||", $SocialInfo_arr[$i])[0];
                    $SocialIco = explode("||", $SocialInfo_arr[$i])[1];
                    $SocialUrl = explode("||", $SocialInfo_arr[$i])[2];
                    $SocialInfos[] = array("SocialTitle" => trim($SocialTitle), "SocialIco" => trim($SocialIco), "SocialUrl" => trim($SocialUrl));
                }
            }
        }
        ?>
        <section class="top-social">
            <?php foreach ($SocialInfos as $item) : ?>
                <li class="<?php echo $item['SocialTitle']; ?>">
                    <a class="<?php echo $item['SocialTitle']; ?>A" href="<?php echo $item['SocialUrl']; ?>" target="_blank" title="<?php echo $item['SocialTitle']; ?>">
                        <img src="<?php echo $item['SocialIco']; ?>" />
                    </a>
                </li>
            <?php endforeach; ?>
        </section>
    <?php endif; ?>

	<!-- PC侧栏社交信息 -->
    <?php if ($this->options->SocialInfo && (($this->options->SocialSwitch === 'on') || ($this->options->SocialSwitch === 'on2'))) : ?>
        <?php
        $SocialInfo = $this->options->SocialInfo;
        if ($SocialInfo) {
            $SocialInfo_arr = explode("\r\n", $SocialInfo);
            if (count($SocialInfo_arr) > 0) {
                for ($i = 0; $i < count($SocialInfo_arr); $i++) {
                    $SocialTitle = explode("||", $SocialInfo_arr[$i])[0];
                    $SocialIco = explode("||", $SocialInfo_arr[$i])[1];
                    $SocialUrl = explode("||", $SocialInfo_arr[$i])[2];
                    $SocialInfos[] = array("SocialTitle" => trim($SocialTitle), "SocialIco" => trim($SocialIco), "SocialUrl" => trim($SocialUrl));
                }
            }
        }
        ?>
        <section class="top-social pe-social">
            <?php foreach ($SocialInfos as $item) : ?>
                <li class="<?php echo $item['SocialTitle']; ?>">
                    <a class="<?php echo $item['SocialTitle']; ?>A" href="<?php echo $item['SocialUrl']; ?>" target="_blank" title="<?php echo $item['SocialTitle']; ?>">
                        <img src="<?php echo $item['SocialIco']; ?>" />
                    </a>
                </li>
            <?php endforeach; ?>
        </section>
    <?php endif; ?>

    // 侧栏社交信息开关
    $SocialSwitch = new Typecho_Widget_Helper_Form_Element_Select(
    'SocialSwitch',
    array(
        'off' => '关闭（默认）',
        'on' => '开启PC社交信息',
        'on1' => '开启PE社交信息',
        'on2' => '同时开启PC与PE社交信息',
    ),
    'off',
    '是否启用侧栏社交信息',
    '介绍：开启后，侧栏展示社交信息功能（必须填写下面的侧栏社交信息）'
    );
    $SocialSwitch->setAttribute('class', 'joe_content joe_other'); //没有custom.php就把joe_custom改成joe_other
    $form->addInput($SocialSwitch->multiMode());

    //侧栏社交信息
    $SocialInfo = new Typecho_Widget_Helper_Form_Element_Textarea(
    'SocialInfo',
    NULL,
    NULL,
    '侧栏社交信息',
    '介绍：用于设置侧栏社交信息 <br />
         格式:社交简称(微信必须固定格式WeChat) || 社交图标 || 跳转链接(微信则填二维码链接) <br />
         比如: Bilibili || 图标链接 || id(中间使用两个竖杠分隔) <br />
         其他：其他:一行一个，一行代表一个社交信息 '
    );
    $SocialInfo->setAttribute('class', 'joe_content joe_other'); //没有custom.php就把joe_custom改成joe_other
    $form->addInput($SocialInfo);

.top-social{position:relative;padding:10px 0;width:250px;display:flex;flex-wrap:wrap;background:var(--background);justify-content:space-around;margin-bottom:15px;border-radius:var(--radius-wrap);box-shadow:var(--box-shadow)}.top-social li{width:50px;text-align:center;padding:5px 0px}.top-social li img{height:25px}.top-social .wechat{position:relative}.top-social .wechat .wechatInner{display:none;position:absolute;box-shadow:0px 1px 4px 2px var(--theme);border-radius:var(--radius-wrap);transition:.7s all ease;background:var(--background);-webkit-transition:.7s all ease;top:-175px;left:-45px;transform:translate3d(0, 16px, 0);width:140px;height:140px}.top-social .wechat .wechatInner::before{content:"";position:absolute;bottom:-16px;left:0;right:0;margin:auto;display:inline-block;width:0px;border:18px solid transparent;border-bottom:none;border-top-color:#fff;filter:drop-shadow(0px 4px 2px var(--theme))}.top-social .wechat .wechatInner img{border-radius:var(--radius-wrap);width:140px;height:auto;padding:0;background:none}.top-social .wechat:hover .wechatInner{display:block}.pe-social{width:100%}