尧图网站建设 尧图网络
  • 首页
  • 关于我们
  • 服务项目
  • 案例展示
  • 建站流程
  • 资讯中心
  • 联系我们
首页/资讯中心/详情

使用 Github Pages 和 Hexo 搭建博客

使用 Github Pages 和 Hexo 搭建博客
📅 发布时间:2026/6/20 12:07:06
介绍了使用GitHub Pages和Hexo搭建个人博客的优缺点及详细流程。优点包括免费服务器、二级域名和安全性保障;缺点涉及SEO收录较差和网络不稳定。搭建步骤涵盖GitHub仓库创建、Hexo初始化配置、文章编写发布及主题更换等内容。作者推荐了NexT等主题,并提供了主站和GitHub Pages博客的对比实例。整体流程清晰,适合想快速搭建免费博客的技术爱好者参考。

一、前言

其实可以通过github.io搭建wiki或者个人博客我挺久之前就知道,不过一直没用,主要是因为已经有一个博客了,没必要再搭一个,不过最近兴起,就搭了个这个附属博客,同步更新主博客的文章。

附属博客地址(Hexo):https://baby7.github.io/

主博客地址(自研):https://www.baby7blog.com/index.html

截图:

baby7.github.io首页截图

下面说一下优缺点,主要对比的是购买服务器搭建个人博客。

优点:

  • 不需要买服务器

使用Github Pages的服务器,只需要建一个github仓库,然后往里面放html文件就可以了,不需要去买服务器续费服务器。

  • 不需要买域名

可以直接使用Github Pages提供的二级域名,不仅省去了买域名的花费,还省去了域名申请这个冗长的流程。

  • 不需要担心被攻击

有Github撑腰,一点不带怕的,不像我现在这个博客,三天两头被攻击o(╥﹏╥)o

缺点:

  • 不利于SEO收录

我尝试在百度的站长平台验证Github给的二级域名都提示不能被收录,不过可以通过再购买一个域名做转发,但这又是一笔花费,而且域名申请挺麻烦的。

新发现:google和必应可以收录github.io的网站!

谷歌站长工具: https://search.google.com/search-console?hl=zh-CN

必应站长工具: https://www.bing.com/webmasters

  • 网络不太通畅

众所都周知,国内github的网络情况一言难尽,经常访问不了,这种情况在用它搭博客的情况下还不利于seo。当然如果自用的话有魔法就没问题了。


二、搭建

先推荐下官方的搭建方法,我搭建完才看见这个,不过也懒得再换了。

在 GitHub Pages 上部署 Hexo


三、流程

一、 Github部分

1. 仓库

首先在建立一个仓库,仓库名是username.github.io,其中username是你的github账号名,这个也是你的最终的博客域名,如果你想改个别的域名,要不然改github的账号名(不过理论上之前仓库的地址都会变),要不然再申请一个账号。另外记得仓库的权限要设置成公开,不然无法访问。

截图:

GithubPages配置截图

2. 初始化

复制仓库地址,在本地使用你常用的开发软件或者VsCode什么的拉取代码然后创建一个index.html。

index.html

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body><h1>学习HTML五年有余,得此页面</h1>
</body>
</html>

3. 测试

push到仓库上以后等待Github Action完成,进入浏览器输入username.github.io测试是否能看到第二步初始化中的<h1>标签中的内容


二、Hexo部分

1. 初始化

首先进入仓库,然后执行如下命令

$ hexo init <folder>
$ cd <folder>
$ npm install

folder随便起,最好就起个hexo

2. 修改基础配置

修改_config.yml,这里放一下基础设置(来源官网)

设置 描述
title 网站标题
subtitle 网站副标题
description 网站描述
keywords 网站的关键词。 支持多个关键词。
author 您的名字
language 网站使用的语言。 使用 2 个字母的 ISO-639-1 代码,或 它的变体。 默认为 en。
timezone 网站时区, Hexo 默认使用您电脑的时区。 请参考 时区列表, 中国可以用 Asia/Shanghai。

3. 新增文章

执行命令

$ hexo new [layout] <title>

layout是布局,这里先填post就行,然后title是文章标题

在目录/source/_posts中找到对应的md文件进行写作

4. 编辑文章

这里放个例子

---
title: 第一篇文章
date: 2024-01-01 00:00:00
---> # 学习Markdown五年有余,得此文章

5. 本地运行

修改后在命令行运行

hexo server -p 4000

在浏览器输入localhost:4000查看是否可以访问到

6. 生成

在命令行输入

hexo generate

会在/public中生成所有的静态文件,复制所有的,粘贴到仓库那一层(就是上上层)

7. 测试

然后push除了的文件,等待Github Action完成后进入浏览器输入username.github.io测试是否能正常查看


四、主题

好看的博客主题必不可少

官方的主题仓库里有不少,我推荐最后更新时间比较近的,时间远的可能版本和Hexo不匹配。

主题仓库:https://hexo.io/themes/

  • 使用:

一般是使用首先使用命令下载主题

$ git clone https://github.com/xxx/xxx-xxxx.git themes/xxxxx

然后在_config.yml文件中修改使用的主题

theme: xxxxx
  • 选型:

纯看自己审美,我的主博客是暗色风还花里胡哨的,这个新搭建的就选一个浅色的,也没有多余东西的风格,做一下推荐:NexT

相关新闻

  • linux 移动硬盘加载失败
  • java Web 检查清单程序设计与实现 - 教程
  • 实用指南:如何快速学习一个网络协议?

最新新闻

  • 3步掌握终极Mac清理方案:彻底告别应用残留释放磁盘空间
  • 嵌入式GUI开发:SEGGER emWin 2D图形库核心技术与实战指南
  • 降AIGC平台红黑榜:实测3款热门工具,剖析实用程度与常见陷阱,文末附妙招
  • Sunshine游戏串流实用配置指南:7个高效解决方案与进阶技巧
  • M68HC08电机控制SDK:从硬件抽象到工业级代码的嵌入式开发实践
  • Qwen3 MOE架构与Reasoning RL技术解析及本地部署实战

日新闻

  • Visual C++运行库修复终极指南:5分钟快速解决Windows软件启动错误
  • 手把手教你构建统计局地区经济数据爬虫:从环境搭建到数据持久化全指南
  • 2026多Agent深度解析:用AI团队替代单一模型,四种架构实战落地

周新闻

  • Visual C++运行库修复终极指南:5分钟快速解决Windows软件启动错误
  • 手把手教你构建统计局地区经济数据爬虫:从环境搭建到数据持久化全指南
  • 2026多Agent深度解析:用AI团队替代单一模型,四种架构实战落地

月新闻

  • 【总结】入门篇:50句话让你记住架构核心概念
  • WeChatMsg技术方案解析:实现Mac微信数据自主管理的完整解决方案
  • WeChatMsg:革新性微信数据备份方案,打造你的专属数字记忆库

关于尧图

  • 公司简介
  • 团队介绍
  • 企业文化
  • 荣誉资质

服务项目

  • 定制开发
  • 电商建站
  • UI 设计
  • 运维服务

快速链接

  • 案例展示
  • 建站流程
  • 常见问题
  • 资讯中心

联系方式

  • 📍北京市朝阳区互联网产业园 A 座 10 层
  • 📞400-888-8888
  • ✉️contact@rkmt.cn
  • 🕐周一至周日 9:00-21:00

© 2024 北京尧图网络科技有限公司 版权所有 | 京 ICP 备 XXXXXXXX 号