第二期 使用Hexo+GitHub+Cloudflare实现0成本搭建个人博客网站,无需服务器。

好,接着上期文章继续做一个完善和扩展。
如果有小伙伴不想自己搭建,可以在后台私信或者✈上联系我代搭建,不过得收点技术费。

✅任务一:新建并上传一篇新博文。
命令都在Git Bash中执行,cd到Hexo源文件目录中。
使用以下命令创建一个md格式的文件,这个md文件就是要编写博客的内容,页面整体是使用Markdown的格式来书写的。
hexo new 新文章.md之后在你的Hexo源码目录中的source_posts目录底下会看到你刚刚创建的md文件。

title是文章的标题,可自行修改。tags就是标签,后期要进行分类的时候需要用到。
如果博客中需要插入图片,不是说像写网页一样加入个标签,在Markdown中需要特定的格式插入图片。这里需要在一个网站中弄个图床。
https://img.131213.xyz/上传一张图片,然后选择Markdown,复制下来链接。

然后直接粘贴到博客文件中。

然后执行以下命令,在我们本地查看一下效果。
hexo cl && hexo s打开之后你的页面就是这个样子的。

图片也能正常显示出来。
当你页面做好之后,你可以把你的博客推送到GitHub项目仓库中。
hexo cl && hexo g && hexo d之后你的Cloudflare中Workers和Pages的所有部署中会出现新的部署。

每次把项目推送到GitHub仓库中,Cloudflare会自动进行部署。
访问你的网站,你会看到你刚刚做的博客页面。

✅任务二:美化博客网站,设置主题。
在Hexo根目录底下打开Git Bash,然后执行以下命令下载主题文件。
git clone -b main https://github.com/anzhiyu-c/hexo-theme-anzhiyu.git themes/anzhiyu或者直接访问GitHub项目地址,查看有没有发布最新版。
https://github.com/anzhiyu-c/hexo-theme-anzhiyu然后执行以下命令安装Pug渲染器:
npm install hexo-renderer-pug hexo-renderer-stylus --save如果你没有安装Pug渲染器,你在运行博客的时候会出现下方图片中的错误。

下载完成之后,在Hexo根目录找到themes目录,然后找到anzhiyu目录,复制一份_config.yml,名称改为_config.anzhiyu.yml,然后粘贴到Hexo根目录中。
_config.anzhiyu.yml
现在Hexo根目录有三个yml配置文件。
使用VSCode打开_config.yml,Ctrl+F查找theme,将冒号后边内容改成anzhiyu。

之后在本地查看效果。
hexo cl; hexo s
确认好之后,将配置推送到GitHub中。
hexo cl; hexo g; hexo d之后我们在打开网站链接进行访问,正常打开并且是更换主题之后的页面,证明成功了。

执行以下命令,生成标签页和分类页:
hexo new page tags然后将_config.anzhiyu.yml配置文件中的标题的注释去掉。

这时候页面就会出现标题。

在Hexo根目录中,找到source/tags,编辑index.md,修改里面的内容:
---
title: tags
date: 2025-04-11 15:45:19
type: "tags"
comments: false
top_img: false
---
执行以下命令生成分类页:
hexo new page categories找到source/categories目录下的index.md文件,修改里面的内容:
---
title: 分类
date: 2025-04-11 15:54:50
aside: false
type: "categories"
top_img: false
---
配置好之后,在本地预览一下效果。


能出现这两个页面,证明成功了。
更多的功能,我这边就不过多演示了,可自行去互联网搜索。
可访问安知鱼官方网站进行学习和配置:
https://docs.anheyu.com/✅任务三:配置自定义域。
找一个平台购买域名,这里我使用的是Spaceship这个平台。
https://www.spaceship.com/
注册账号和购买流程就不展示了,支持支付宝支付。
我购买了一个.top的域名。

选中域名,选择右侧的“名称服务器和DNS”。

点击更改名称服务器

选择自定义名称服务器,让Cloudflare托管。

打开Cloudflare,在账户主页添加域名,在现有域输入框中输入你购买的域名,然后点击继续。

计划就选择免费的。

查看DNS记录这个页面不用管,直接点击继续前往激活。
然后复制两个Cloudflare名称服务器,粘贴到Spaceship中购买的域名的自定义名称服务器。然后保存DNS设置。
回到Cloudflare页面,点击继续,然后滑到底部,点击立即检查名称服务器按钮,需要等待一段时间生效。回到账户主页,查看域状态,当前状态是无效的,等状态显示活动证明完成了。

大概等了3、4分钟吧,状态就变成活动了。

找到Workers和Pages,找到GitHub部署的项目,找到自定义域,输入刚刚添加的域名。

确认信息无误,然后点击“激活域”

单击复制名称和目标。

在域Spaceship中添加类型为“CNAME”的DNS记录。

主机填写@或者域名名称,值填写目标。

然后点击保存。
接着你需要回到Cloudflare中配置域名的DNS,为域名添加以下DNS配置:
类型 名称 内容 代理状态 TTL
CNAME www 用户名-github-io.dev 开启 自动
之后你再查看自定义域的状态,状态就是处于活动。

访问你的域名,就能访问到你的博客网站了。
这是我搭建好的网站,功能有待完善。

本篇内容到此结束。
写作不易,多多支持。
三连加关注,追文不迷路。

