2024 VPS Hexo Fluid 个人博客从初建到完善

温馨提示:
“本文的诞生缘由于笔者初立该博客的第一篇文章
因此不可避免的教程内容可能存在错误或误导” :P

前言

准备需要：

🖥 IPV4的海外VPS小鸡

🔗 只属于你的域名网站

🪄 留学霍格沃兹的电脑

👋 敲打键盘的灵活小手

🧠 善于思考的最强大脑

本文主机配置：1C/1U 系统：Ubuntu

文章内容

部署宝塔面板

ubuntu 更新源

sudo apt-get update
sudo apt-get upgrade

Linux宝塔面板安装脚本

#Centos安装脚本
yum install -y wget && wget -O install.sh https://download.bt.cn/install/install_6.0.sh && sh install.sh ed8484bec
#Ubuntu/Deepin安装脚本
wget -O install.sh https://download.bt.cn/install/install-ubuntu_6.0.sh && sudo bash install.sh ed8484bec
#Debian安装脚本
wget -O install.sh https://download.bt.cn/install/install-ubuntu_6.0.sh && bash install.sh ed8484bec
#万能安装脚本
if [ -f /usr/bin/curl ];then curl -sSO https://download.bt.cn/install/install_panel.sh;else wget -O install_panel.sh https://download.bt.cn/install/install_panel.sh;fi;bash install_panel.sh ed8484bec

安装完成后SSH面板写有宝塔面板的地址及账号&密码，访问面板并登陆，选择安装lnmp，左侧列表点击Docker将其安装。

使用Docker一键部署 Hexo

hexo 是一个快速、简单且功能强大的静态博客框架

Docker 版 hexo 环境一键部署

docker create --name=hexo \
-e HEXO_SERVER_PORT=4000 \ #映射端口
-e GIT_USER="用户名" \
-e GIT_EMAIL="邮箱地址" \
-v /mnt/域名网站:/app \ #存放博客的目录
-p 4000:4000 \
bloodstar/hexo

宝塔面板依次点击 Docker->容器->hexo->重启

启动 Hexo Docker 容器

随后进入SSH键入： docker exec -it hexo bash

每个人的审美不同可以在github上寻找适合你的hexo主题
这里我使用的是Fluid

最后在宝塔面板 添加站点 获取LSS证书并开启反向代理 & cloudflare配置CDN，就可以通过域名访问了！！

步骤进行到 添加站点获取LSS证书并开启反向代理 时回到这里注册cloudflare配置域名解析
Cloudflare教程：如何域名解析与开通免费的CDN【含视频】

温馨提示:
“步骤进行到`添加站点获取LSS证书并开启反向代理` 时回到这里注册cloudflare配置域名解析“

为 Hexo 配置 Fluid 主题

Fluid 是一款 Material Design 风格的主题

下载 最新 release 版本 解压到/mnt/域名网站文件夹下的 themes 目录，并将解压出的文件夹重命名为fluid。

覆盖主题配置

Hexo 5.0.0 版本以上的用户，在博客目录/mnt/域名网站下创建 _config.fluid.yml 文件，将主题的 _config.yml 全部配置（或部分配置）复制过去。

• 只要存在于 _config.fluid.yml 的配置都是高优先级，修改原 _config.yml 是无效的。

启动 Hexo Docker 来自Fluid官方配置文档

添加站点获取LSS证书并开启反向代理

添加站点

在宝塔面板 网站->添加站点->填写域名->确定

添加站点

反向代理

点击刚添加好的域名左侧栏点击 反向代理-> 添加反向代理

添加反向代理
注意端口 每一个站点对应一个 域名:端口 不可重复

Twikoo评论插件私有化部署

打开博客根目录/mnt/域名网站文件夹下的 _config.fluid.yml 文件
搜索关键字：comments 将其修改

# 评论插件
  # Comment plugin
  comments:
    enable: true #开启评论插件
    # 指定的插件，需要同时设置对应插件的必要参数
    # The specified plugin needs to set the necessary parameters at the same time
    # Options: utterances | disqus | gitalk | valine | waline | changyan | livere | remark42 | twikoo | cusdis | giscus | discuss
    type: twikoo #选用twikoo评论插件

#拉取镜像
sudo docker pull imaegoo/twikoo

#创建并启动容器
sudo docker run -p 8099:8080 -v /root/twikoo/data:/app/data -d imaegoo/twikoo

访问http://服务器ip:8099 即twikoo的服务地址 可见如上图

再给它服务器ip:port在宝塔面板获取SSL证书以及添加反向代理
回到 /mnt/域名网站 文件夹下的 _config.fluid.yml 文件
搜索关键字：Twikoo 并修改

# Twikoo
# 支持腾讯云、Vercel、Railway 等多种平台部署
# Based on Tencent CloudBase
# See: https://twikoo.js.org
twikoo:
  envId: https://域名
  region:
  path:

重启hexo docker容器访问博客，评论并设置好管理密码。

安装 Hexo pro 博客管理系统

npm install --save hexo-pro
hexo server -d
open http://localhost:4000/pro/

配置登陆账户与密码
需要在/mnt/域名网站 文件夹下的 _config.fluid.yml 文件中增加以下配置来使用账户密码登陆后台，不配置后台会直接登陆。 配置后使用jwt来保护后台访问的接口。

hexo_pro:
  username: 用户名
  password: 密码
  avatar:  
  secret:

重启hexo docker容器访问博客管理地址 http://localhost:4000/pro/

🎉教程结束🎊

后记

值日生记得擦黑板