免费搭建 Hexo 博客： Github Pages 部署全攻略

博主： demius
发布时间：2024 年 10 月 24 日
405 次浏览
3 条评论
11287字数
分类： Hexo

## 前言

这里以使用码云 Gitee Pages部署hexo博客为教程，虽然现在码云停止了这个服务，但是其他平台大同小异，都差不多，主要是学习一下hexo这个CMS！

### 前期准备

* **注册码云账号**：访问码云官网（[https://gitee.com/](https://gitee.com/)），按照提示填写相关信息完成注册。
* **安装相关软件**：在本地安装 Node.js 和 Git，Node.js 可通过官网下载安装包进行安装，Git 可在其官网（[https://git-scm.com/downloads](https://git-scm.com/downloads)）下载安装。
* **安装 Hexo**：在命令行工具中输入 `npm install -g hexo-cli` ，完成 Hexo 的全局安装。

**详细说明：**

* **Windows 系统**：
  1. 访问 Node.js 官网（[https://nodejs.org/](https://nodejs.org/)） ，在首页会看到两个绿色按钮，初学者建议选择左侧的 LTS 版本下载按钮，点击即可开始下载安装包 。
  2. 下载完成后，双击安装包运行安装程序。
  3. 在安装向导中，依次点击 “Next”。在选择安装路径页面，可默认安装到 C 盘，也可根据自己需求更改路径，点击 “Next” 。
  4. 在选择安装功能页面，保持默认设置，直接点击 “Next”。
  5. 最后点击 “Install” 开始安装，等待安装完成后，点击 “Finish” 退出安装向导。
* **macOS 系统**：
  1. 同样访问 Node.js 官网，点击 LTS 版本的下载按钮，下载 Mac 系统的安装包。
  2. 下载完成后，打开安装包，按照提示将 Node.js 图标拖移到 “Applications” 文件夹中，即可完成安装。
* **Linux 系统**：推荐使用 Nodesource 安装包管理器来安装 Node.js。以 Ubuntu 为例，在终端中依次执行以下命令 ：

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

</div><div role="tabpanel" id='tabs-330ab6f253d73bca14cec57aaaf1a709101' class="tab-pane fade  ">

* **Windows 系统** ：
  1. 打开 Git 官网（[https://git-scm.com/downloads](https://git-scm.com/downloads)），页面会自动识别你的操作系统并提供对应的下载链接，点击下载 Git for Windows 安装包。
  2. 下载完成后，运行安装程序，在安装向导中，除了选择安装路径外，其他步骤基本都可以保持默认设置，一直点击 “Next” 直到安装完成。
  3. 安装完成后，在开始菜单中找到 “Git Bash”，点击打开，输入 `git version`命令，如果能显示 Git 版本信息，则说明 Git 安装成功。
* **macOS 系统** ：
  1. 对于 Mac 系统，Git 通常已经预装，如果没有预装或者需要更新版本，可以通过 Homebrew 来安装。在终端中输入以下命令安装 Homebrew：

```bash
/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"
```

2. 安装完成后，再输入以下命令安装 Git：

```bash
brew install git
```

3. 安装完成后，在终端中输入 `git version`命令，若能显示 Git 版本信息，则表明 Git 安装成功。

* **Linux 系统**：不同的 Linux 发行版安装 Git 的方式略有不同，以 Ubuntu 为例，在终端中输入以下命令即可安装 Git ：

```bash
sudo apt-get install git
```

</div><div role="tabpanel" id='tabs-ac249ec06010f135be624c8a8364acdc832' class="tab-pane fade  ">

在安装好 Node.js 和 Git 后，就可以安装 Hexo 了。打开命令行工具（Windows 系统可使用 Git Bash 或命令提示符，macOS 和 Linux 系统使用终端），输入以下命令进行 Hexo 的全局安装 ：

```bash
npm install -g hexo-cli
```

安装完成后，可以通过以下命令检查 Hexo 是否安装成功：

```bash
hexo -v
```

如果能显示 Hexo 的版本信息，则说明 Hexo 安装成功。

</div>
</div>
</div>

### 创建项目

* **新建仓库**：登录码云账号，点击头像旁边的 “+” 号，创建一个新的仓库，仓库名称必须与你的码云账号用户名相同 ，其他信息可根据需求填写，访问权限建议设置为公开。

### 配置 Hexo 项目

* **初始化项目**：在本地选择一个合适的目录，打开命令行工具，执行 `hexo init blog`命令，其中 `blog`为项目文件夹名，可自定义，初始化完成后，该文件夹下会生成一系列 Hexo 项目文件 。
* **安装部署插件**：在项目目录下的命令行中输入 `npm install hexo-deployer-git --save` ，安装 Hexo 的 Git 部署插件。
* **修改配置文件**：打开项目目录下的 `_config.yml`文件，找到 `deploy`配置项，将其修改为以下内容 ：

```yaml
deploy:
  type: git
  repo: git@gitee.com:yourusername/yourusername.git
  branch: master
```

其中 `yourusername`为你的码云账号用户名，需确保与仓库名称一致。

### 添加 SSH 公钥

* **生成 SSH 公钥**：在本地命令行中输入 `ssh-keygen -t rsa -C "your_email@example.com"` ，其中 `your_email@example.com`为你注册码云账号时使用的邮箱地址，按回车键确认，一路默认设置即可生成 SSH 公钥对。
* **添加公钥到码云**：登录码云账号，进入设置页面，找到 “安全设置” 中的 “SSH 公钥” 选项，点击 “新增部署公钥”，将上一步生成的公钥文件（一般在 `C:\Users\你的电脑用户名.ssh\id_rsa.pub`目录下）中的内容复制粘贴到公钥内容框中，公钥标题可自定义 。

### 生成静态文件并部署

* **生成静态文件**：在 Hexo 项目目录下的命令行中输入 `hexo generate` ，或使用简写命令 `hexo g` ，Hexo 会根据你的文章和主题配置生成静态文件，存放在 `public`文件夹中 。
* **部署到码云**：执行 `hexo deploy` ，或简写为 `hexo d` ，此时 Hexo 会将 `public`文件夹中的静态文件推送到码云仓库中。

### 开启 Gitee Pages 服务

* **进入服务页面**：在码云仓库的主页找到 “服务” 选项，点击后可看到 “Gitee Pages”，点击跳转至 Gitee Pages 服务页面。
* **开启服务**：在 Gitee Pages 服务页面中，点击 “启动” 按钮开启服务，服务开启后，你的博客即可通过 `https://yourusername.gitee.io`访问，其中 `yourusername`为你的码云账号用户名。

## 设置 Hexo 博客的主题

### **寻找主题**

* 可以在 Hexo 官方主题网站（[https://hexo.io/themes/](https://hexo.io/themes/)）查找官方推荐的主题。这些主题通常有详细的文档说明和示例展示。
* 也可以在 GitHub 上搜索 Hexo 主题，有大量开发者分享的自定义主题。在搜索时，可以参考主题的星级、下载量和更新频率来判断主题的质量和受欢迎程度。

### **下载主题**

* 一般来说，主题是以代码仓库的形式存在的。以从 GitHub 下载主题为例，找到想要的主题仓库后，复制仓库的 URL。
* 在本地 Hexo 博客项目的根目录下，打开命令行工具，使用 `git clone [主题仓库URL] themes/[主题名称]`命令来下载主题。例如，`git clone https://github.com/iissnan/hexo-theme-next themes/next`就是将 Next 主题下载到 `themes`文件夹下，并命名为 `next`。

### **启用主题**

* 打开 Hexo 博客项目根目录下的 `_config.yml`文件，找到 `theme`字段。
* 将 `theme`的值修改为刚刚下载的主题名称。例如，如果下载的主题命名为 `next`，则将 `theme: next`。

### **配置主题**

* 不同的主题有不同的配置选项，这些选项通常在主题文件夹下的 `_config.yml`文件中进行设置。
* 以 Next 主题为例，它的 `_config.yml`文件中有关于菜单设置、侧边栏布局、社交账号链接等多种配置选项。
  * 如设置菜单，格式通常为：

```yaml
menu:
  home: / || home
  about: /about/ || user
  tags: /tags/ || tags
  categories: /categories/ || th
  archives: /archives/ || archive
```

* 这里 `home`、`about`等是菜单名称，`/`、`/about/`等是对应的链接路径，`||`后面的是图标名称（如果主题支持图标的话）。
* 还可以配置主题的颜色风格、字体等外观相关的内容。例如，Next 主题可以通过修改 `_config.yml`中的 `scheme`字段来改变主题的配色方案，如 `scheme: Pisces`。

### **自定义主题（可选）**

* 如果对主题有更个性化的需求，可以修改主题的模板文件。主题的模板文件一般使用 EJS、Pug 等模板语言编写，存放在主题文件夹下的 `layout`文件夹中。
* 例如，想要修改文章页面的布局，可以在 `layout/_post.ejs`（以 EJS 模板为例）文件中调整 HTML 结构、添加或删除元素。
* 也可以通过添加自定义 CSS 来修改主题的样式。在主题文件夹下创建一个 `source/css`文件夹（如果不存在的话），并创建一个自定义的 CSS 文件，如 `custom.css`。在主题的 `_config.yml`文件中，找到引入 CSS 文件的部分，将 `custom.css`添加进去，然后在 `custom.css`文件中编写自定义的样式规则，如：

```css
body {
    background - color: #f5f5f5;
}
```

这样就可以将博客的背景颜色修改为 `#f5f5f5`。

## 在hexo博客中编辑和发布文章

### **创建新文章**

* 使用命令行工具：在 Hexo 博客的根目录下，通过 `hexo new [文章标题]`命令来创建新文章。例如，`hexo new "我的第一篇博客"`，这会在 `source/_posts`文件夹下生成一个以文章标题命名的 Markdown 文件（标题中的空格会被转换为连字符）。
* 手动创建：也可以直接在 `source/_posts`文件夹下手动创建一个 Markdown 文件来撰写文章。不过要注意文件的命名最好符合规范，且以 `.md`为后缀。

### **撰写文章内容**

* 打开生成或创建的 Markdown 文件，使用 Markdown 语法撰写文章。
* **标题设置**：文章的标题一般在文件开头，以 `# [文章标题]`的形式表示，例如 `# 探索新技术`。
* **段落编写**：直接在标题后另起一行开始写段落内容，每段之间空一行即可。例如：

```markdown
# 探索新技术
在当今快速发展的时代，新技术如雨后春笋般涌现。

这些新技术正在改变我们的生活方式。
```

* **插入图片**：如果要插入图片，可以将图片放在 `source/images`文件夹（可自行创建）下，然后在文章中使用 `![图片描述](图片路径)`的语法来插入，例如 `![美丽的风景](images/landscape.jpg)`。
* **添加链接**：使用 `[链接文字](链接地址)`的语法添加外部链接，如 `[Hexo官方网站](https://hexo.io/)`。
* **引用内容**：使用 `> [引用内容]`的语法来引用他人的观点或其他内容，例如：

```markdown
> 马克·吐温曾说：“人的思想是了不起的，只要专注于某一项事业，就一定会做出使自己感到吃惊的成绩来。”
```

* **列表排版**：
  * 有序列表使用 `1. [内容]`、`2. [内容]`等形式，例如：

```markdown
1. 首先，我们要明确目标。
2. 其次，制定计划。
```

* 无序列表使用 `- [内容]`、`* [内容]`的形式，例如：

```markdown
- 优点一：易于操作。
- 优点二：功能强大。
```

* **代码块插入**：如果要插入代码块，使用三个反引号（\`\`\`）包裹代码，并在第一个反引号后注明代码语言，例如：

```markdown
```python
print("Hello, World!")
```

```plaintext

3. **设置文章属性（可选）**
   - 在文章的Markdown文件开头，可以设置一些文章的属性，例如文章的分类（categories）、标签（tags）和发布时间（date）等。格式如下：
```yaml
---
title: 文章标题
date: 2024-10-24
categories:
  - 技术
tags:
  - Hexo
  - 博客
---
```

* 这里 `date`字段用于指定文章的发布日期，`categories`字段用于设置文章所属的分类，`tags`字段用于添加文章的标签。这些属性可以帮助读者更好地浏览和分类你的博客内容，同时也有利于搜索引擎优化（SEO）。

### **生成静态文件**

* 在完成文章撰写后，使用 `hexo generate`（或 `hexo g`）命令来生成静态文件。这个命令会将 Markdown 文件转换为 HTML、CSS 和 JavaScript 等静态文件，这些文件会被生成到 `public`文件夹中。

### **本地预览（可选）**

* 在发布之前，建议使用 `hexo server`（或 `hexo s`）命令在本地启动一个服务器来预览博客的效果。运行这个命令后，你可以在浏览器中访问 `http://localhost:4000`查看博客的样子。这一步可以帮助你检查博客的布局、样式、链接等是否符合预期，避免发布后出现问题。

### **发布文章**

* 当对文章内容和博客的整体效果满意后，使用 `hexo deploy`（或 `hexo d`）命令将博客部署到目标平台（如之前配置好的码云 Gitee Pages 等）。部署完成后，读者就可以通过博客的网址访问到新发布的文章。

## 绑定域名

<div class="tab-container post_tab box-shadow-wrap-lg">
<ul class="nav no-padder b-b scroll-hide" role="tablist">
<li class='nav-item active' role="presentation"><a class='nav-link active' style="" data-toggle="tab" 
aria-controls='tabs-ea6bc94e16f792c91e164bf7784c1444250' role="tab" data-target='#tabs-ea6bc94e16f792c91e164bf7784c1444250'>Github pages</a></li><li class='nav-item ' role="presentation"><a class='nav-link ' style="" data-toggle="tab" 
aria-controls='tabs-21068c57b032b7cd2f238cf254c28dc6561' role="tab" data-target='#tabs-21068c57b032b7cd2f238cf254c28dc6561'>码云</a></li>
</ul>
<div class="tab-content no-border">
<div role="tabpanel" id='tabs-ea6bc94e16f792c91e164bf7784c1444250' class="tab-pane fade active in">

1. **购买域名**
   * 首先，你需要在域名注册商处购买一个域名。常见的域名注册商有 GoDaddy、Namecheap、阿里云、腾讯云等。在注册过程中，按照注册商的要求填写相关信息，完成域名的购买。
2. **配置域名解析（DNS）**
   * **在域名注册商处操作**：
     * 登录到你购买域名的注册商网站，找到域名管理控制台。
     * 查找域名解析设置选项，通常称为 “DNS 管理” 或 “域名解析”。
     * 添加两条记录：
       * A 记录：将主机记录（Host）设置为 `@`（代表根域名，如 `yourdomain.com`），记录类型为 A，记录值填写你的 GitHub Pages 服务器的 IP 地址。对于 GitHub Pages，这个 IP 地址通常是 `185.199.108.153`、`185.199.109.153`、`185.199.110.153`、`185.199.111.153`这几个中的一个。不过，最好参考 GitHub 官方文档确认最新的 IP 地址信息。
       * CNAME 记录（如果需要）：如果你的域名是二级域名（如 `blog.yourdomain.com`）或者你想使用自定义子域名，添加 CNAME 记录。将主机记录设置为你想要的子域名（如 `blog`），记录类型为 CNAME，记录值填写 `your - username.github.io`（其中 `your - username`是你的 GitHub 用户名）。
   * **等待 DNS 传播生效**：域名解析的更改不会立即生效，需要等待一段时间，这个过程称为 DNS 传播。通常可能需要几分钟到几小时不等，具体取决于 DNS 服务器的缓存时间和网络情况。你可以使用在线的 DNS 检查工具来查看域名解析是否已经生效。
3. **在 GitHub 仓库中设置**
   * 登录到 GitHub，进入你的 Hexo 博客仓库（`your - username.github.io`）。
   * 点击仓库的 “Settings” 选项卡。
   * 在 “Settings” 页面中，找到 “Pages” 部分。
   * 在 “Custom domain” 字段中，输入你的域名（如 `yourdomain.com`或 `blog.yourdomain.com`），然后点击 “Save” 按钮。
   * GitHub 会自动检查域名是否正确配置。如果配置正确，你的 Hexo 博客就成功绑定了域名，之后访问这个域名就可以打开你的博客。
4. **注意事项**
   * 如果之前已经访问过你的 GitHub Pages 博客（未绑定域名时），浏览器可能会缓存旧的访问地址。在绑定域名后，可能需要清除浏览器缓存才能正确访问新的域名地址。
   * 确保域名的续费和配置信息及时更新，避免域名过期或者解析错误导致无法访问博客。同时，要遵守域名注册商和 GitHub 的相关规定和政策。

</div><div role="tabpanel" id='tabs-21068c57b032b7cd2f238cf254c28dc6561' class="tab-pane fade  ">

### 购买域名

* 选择域名注册商，如阿里云、腾讯云等。在注册商平台完成注册账号、实名认证等操作后，根据自身需求购买合适的域名  。

### 配置域名解析

* 进入域名注册商的域名管理控制台，找到您购买的域名对应的解析设置选项 。
* 添加一条 CNAME 记录，将域名指向码云 Pages 服务提供的默认域名。一般格式为：您的自定义域名.cname.gitee.io 。

### 在 Hexo 项目中设置

* 在本地 Hexo 项目的根目录下，找到 `source`文件夹，在其中创建一个名为 `CNAME`的文件（注意要大写，无文件扩展名） 。
* 用文本编辑器打开 `CNAME`文件，在其中填写您购买的域名，保存并关闭文件  。

### 部署 Hexo 项目

* 在本地项目目录中打开命令行工具，依次执行以下命令生成静态文件并部署到码云 ：
  * `hexo clean`：清理之前生成的静态文件。
  * `hexo generate`（或 `hexo g`）：生成新的静态文件。
  * `hexo deploy`（或 `hexo d`）：将静态文件部署到码云。

### 等待生效

* 完成上述步骤后，需要等待一段时间，让域名解析生效以及码云服务器完成相关配置。一般来说，域名解析可能需要几分钟到几小时不等，具体时间取决于域名注册商和网络环境。

### 启用https

使用码云 Pages 自带的 HTTPS 功能

* **前提条件**：确保你的码云 Pages 服务已正常开启 ，且博客已成功部署到码云 Pages 上**1** 。
* **操作步骤**：在码云仓库的设置中，找到 Pages 服务相关设置选项，查看是否有直接开启 HTTPS 的按钮或选项。若有，直接点击开启即可。开启后，等待一段时间，让证书生效，一般短时间内可能会出现不安全的提示，稍等片刻即可 。

</div>
</div>
</div>

## 打开hexo博客的后台

**通过命令行启动本地服务器（本地预览）**

* 在 Hexo 博客的根目录下，使用命令 `hexo server`（或简写为 `hexo s`）来启动本地服务器。这会在本地开启一个服务，方便你预览博客的效果。
* 启动后，在浏览器中输入 `http://localhost:4000`，就可以访问你的博客了。这个本地预览界面其实就相当于一个简单的后台界面，你可以在这里查看文章布局、样式、链接等是否符合预期。
* 在这个本地预览状态下，如果你对博客内容或设置进行了修改（比如修改了文章、主题配置等），保存文件后，刷新浏览器页面就能看到更新后的效果。不过要注意，这只是本地预览，外部用户还无法访问这个地址，只有你自己在本地电脑上能通过这个方式查看博客。

**部署后的后台管理（内容更新）**

* Hexo 本身并没有像一些动态网站那样有一个专门的图形化后台管理界面。它主要是通过在本地编辑文章和配置文件，然后重新生成和部署来更新博客。
* 文章编辑：你可以在本地的 `source/_posts`文件夹下找到文章对应的 Markdown 文件进行编辑。例如，添加新文章就使用 `hexo new [文章标题]`命令创建一个新的 Markdown 文件，然后在里面撰写内容。修改完文章后，按照之前部署博客的流程（`hexo clean`、`hexo generate`、`hexo deploy`）重新生成并部署静态文件到服务器上，这样博客内容就更新了。
* 主题和配置修改：如果要修改博客的主题或者其他配置，如添加新的插件、修改主题颜色等。对于主题修改，需要在本地的主题文件夹（`themes`文件夹下对应的主题目录）中进行操作，例如修改主题的 `_config.yml`文件或者模板文件。对于全局配置修改，在 Hexo 项目根目录下的 `_config.yml`文件中进行。同样，修改完成后，需要重新生成和部署静态文件来使修改生效。

## 使用1panel面板部署hexo博客

### 前期准备

* **云服务器**：确保你已经拥有一台云服务器，并且已经安装好 1panel 面板 。
* **本地环境**：在本地计算机上安装好 Node.js、Git 等必要软件，以便生成和推送 Hexo 博客的静态文件 。

### 安装相关软件

* **登录 1panel 面板**：使用浏览器访问云服务器的 1panel 面板地址，登录到面板管理界面。
* **安装 Git**：在 1panel 面板的软件商店中，找到 Git 并进行安装 。
* **安装 Node.js**：同样在软件商店中找到 Node.js 并安装 。

### 创建 Git 仓库与站点目录

* **创建 Git 仓库**：在服务器上通过 1panel 面板的文件管理器，创建一个用于存储博客代码的 Git 仓库。例如，在 `/var/repo`目录下创建 `blog.git`裸仓库。
* **创建站点目录**：创建一个用于存放博客静态文件的目录，如 `/var/www/hexo`，并设置好相应的权限，确保 Web 服务器用户能够访问该目录。

### 配置 Git 钩子与 Web 服务器

* **配置 Git 钩子**：在 `/var/repo/blog.git/hooks`目录下创建一个 `post-receive`文件，内容如下 ：

```bash
#!/bin/bash
git --work-tree=/var/www/hexo --git-dir=/var/repo/blog.git checkout -f
```

保存文件后，赋予其可执行权限。

* **配置 Web 服务器**：如果使用 Nginx 作为 Web 服务器，可以在 1panel 面板中配置 Nginx 站点，将服务器域名或 IP 指向 `/var/www/hexo`目录  。

### 本地设置与部署

* **修改 Hexo 配置文件**：在本地的 Hexo 项目目录中，找到 `_config.yml`文件，修改其中的 `deploy`部分，设置部署类型为 `git`，并填写服务器上的 Git 仓库地址，例如：

```yaml
deploy:
  type: git
  repo: git@your_server_ip:/var/repo/blog.git
  branch: master
```

* **生成并部署博客**：在本地终端中，进入 Hexo 项目目录，依次执行以下命令生成静态文件并将其部署到服务器上 ：

```bash
hexo clean
hexo generate
hexo deploy
```

End

文章标签：Hexo，博客

本文标题：免费搭建 Hexo 博客： Github Pages 部署全攻略

本文链接： https://blog.demius.tech/archives/523.html

除非注明，均默认采用 CC BY-NC-SA 4.0许可协议。

声明：转载请注明文章来源。

最后修改：2024 年 10 月 27 日

如果觉得我的文章对你有用，请随意赞赏

暂无相关推荐

3 条评论

demius Google Chrome 141.0.0.0 Windows 10 中国江苏连云港移动
August 27th, 2025 at 12:33 am

滴！学生卡！打卡时间：00:33:31，请上车的乘客系好安全带~

回复
demius Google Chrome 141.0.0.0 Windows 10 中国江苏连云港移动
August 27th, 2025 at 12:33 am

滴！学生卡！打卡时间：00:33:15，请上车的乘客系好安全带~

回复
oggnbrieck 搜狗浏览器 2.X Windows 10 中国北京
March 3rd, 2025 at 02:26 am

文章已具雏形，需进一步聚焦核心问题。

回复

发表评论取消回复
使用cookie技术保留您的个人信息以便您下次快速评论，继续评论表示您已同意该条款

评论 *

打卡

语录

私密评论

名称 *

🎲

邮箱 *

地址

今日已经过去小时

这周已经过去天

本月已经过去天

今年已经过去个月

免费搭建 Hexo 博客： Github Pages 部署全攻略

demius • 2024 年 10 月 24 日

## 前言

这里以使用码云 Gitee Pages部署hexo博客为教程，虽然现在码云停止了这个服务，但是其他平台大同小异，都差不多，主要是学习一下hexo这个CMS！

### 前期准备

**详细说明：**

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

</div><div role="tabpanel" id='tabs-330ab6f253d73bca14cec57aaaf1a709101' class="tab-pane fade  ">

```bash
/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"
```

2. 安装完成后，再输入以下命令安装 Git：

```bash
brew install git
```

3. 安装完成后，在终端中输入 `git version`命令，若能显示 Git 版本信息，则表明 Git 安装成功。

* **Linux 系统**：不同的 Linux 发行版安装 Git 的方式略有不同，以 Ubuntu 为例，在终端中输入以下命令即可安装 Git ：

```bash
sudo apt-get install git
```

</div><div role="tabpanel" id='tabs-ac249ec06010f135be624c8a8364acdc832' class="tab-pane fade  ">

```bash
npm install -g hexo-cli
```

安装完成后，可以通过以下命令检查 Hexo 是否安装成功：

```bash
hexo -v
```

如果能显示 Hexo 的版本信息，则说明 Hexo 安装成功。

</div>
</div>
</div>

### 创建项目

### 配置 Hexo 项目

```yaml
deploy:
  type: git
  repo: git@gitee.com:yourusername/yourusername.git
  branch: master
```

其中 `yourusername`为你的码云账号用户名，需确保与仓库名称一致。

### 添加 SSH 公钥

### 生成静态文件并部署

### 开启 Gitee Pages 服务

## 设置 Hexo 博客的主题

### **寻找主题**

### **下载主题**

### **启用主题**

### **配置主题**

```yaml
menu:
  home: / || home
  about: /about/ || user
  tags: /tags/ || tags
  categories: /categories/ || th
  archives: /archives/ || archive
```

### **自定义主题（可选）**

```css
body {
    background - color: #f5f5f5;
}
```

这样就可以将博客的背景颜色修改为 `#f5f5f5`。

## 在hexo博客中编辑和发布文章

### **创建新文章**

### **撰写文章内容**

```markdown
# 探索新技术
在当今快速发展的时代，新技术如雨后春笋般涌现。

这些新技术正在改变我们的生活方式。
```

```markdown
> 马克·吐温曾说：“人的思想是了不起的，只要专注于某一项事业，就一定会做出使自己感到吃惊的成绩来。”
```

* **列表排版**：
  * 有序列表使用 `1. [内容]`、`2. [内容]`等形式，例如：

```markdown
1. 首先，我们要明确目标。
2. 其次，制定计划。
```

* 无序列表使用 `- [内容]`、`* [内容]`的形式，例如：

```markdown
- 优点一：易于操作。
- 优点二：功能强大。
```

* **代码块插入**：如果要插入代码块，使用三个反引号（\`\`\`）包裹代码，并在第一个反引号后注明代码语言，例如：

```markdown
```python
print("Hello, World!")
```

```plaintext

### **生成静态文件**

### **本地预览（可选）**

### **发布文章**

## 绑定域名

<div class="tab-container post_tab box-shadow-wrap-lg">
<ul class="nav no-padder b-b scroll-hide" role="tablist">
<li class='nav-item active' role="presentation"><a class='nav-link active' style="" data-toggle="tab" 
aria-controls='tabs-ea6bc94e16f792c91e164bf7784c1444250' role="tab" data-target='#tabs-ea6bc94e16f792c91e164bf7784c1444250'>Github pages</a></li><li class='nav-item ' role="presentation"><a class='nav-link ' style="" data-toggle="tab" 
aria-controls='tabs-21068c57b032b7cd2f238cf254c28dc6561' role="tab" data-target='#tabs-21068c57b032b7cd2f238cf254c28dc6561'>码云</a></li>
</ul>
<div class="tab-content no-border">
<div role="tabpanel" id='tabs-ea6bc94e16f792c91e164bf7784c1444250' class="tab-pane fade active in">

</div><div role="tabpanel" id='tabs-21068c57b032b7cd2f238cf254c28dc6561' class="tab-pane fade  ">

### 购买域名

* 选择域名注册商，如阿里云、腾讯云等。在注册商平台完成注册账号、实名认证等操作后，根据自身需求购买合适的域名  。

### 配置域名解析

### 在 Hexo 项目中设置

### 部署 Hexo 项目

### 等待生效

### 启用https

使用码云 Pages 自带的 HTTPS 功能

</div>
</div>
</div>

## 打开hexo博客的后台

**通过命令行启动本地服务器（本地预览）**

**部署后的后台管理（内容更新）**

## 使用1panel面板部署hexo博客

### 前期准备

### 安装相关软件

### 创建 Git 仓库与站点目录

### 配置 Git 钩子与 Web 服务器

* **配置 Git 钩子**：在 `/var/repo/blog.git/hooks`目录下创建一个 `post-receive`文件，内容如下 ：

```bash
#!/bin/bash
git --work-tree=/var/www/hexo --git-dir=/var/repo/blog.git checkout -f
```

保存文件后，赋予其可执行权限。

* **配置 Web 服务器**：如果使用 Nginx 作为 Web 服务器，可以在 1panel 面板中配置 Nginx 站点，将服务器域名或 IP 指向 `/var/www/hexo`目录  。

### 本地设置与部署

```yaml
deploy:
  type: git
  repo: git@your_server_ip:/var/repo/blog.git
  branch: master
```

* **生成并部署博客**：在本地终端中，进入 Hexo 项目目录，依次执行以下命令生成静态文件并将其部署到服务器上 ：

```bash
hexo clean
hexo generate
hexo deploy
```

免费搭建 Hexo 博客： Github Pages 部署全攻略

※相关文章推荐※

※热评文章推荐※

3 条评论

发表评论取消回复
使用cookie技术保留您的个人信息以便您下次快速评论，继续评论表示您已同意该条款

Handsome 助力：提升阅读观影体验的书单电影界面设计

Handsome 主题大升级：原版基础上的惊艳修改与网站风格完美适配全记录（总）

【保姆教程】属于自己的超全漫画库！全平台可用

2024 最强服务器监控神器 ——Uptime Kuma 全解析

TVBox简单教程

CMS 全解析：热门内容管理系统大盘点

从零开始！超详细 Hugo 博客在 GitHub 部署全攻略，新手也能轻松上手

Handsome 主题大升级（三）JS

Linux系统大全，附最新下载地址

国漫崛起，朝花夕拾，数不尽的浪漫与惆怅

免费搭建 Hexo 博客： Github Pages 部署全攻略

※相关文章推荐※

※热评文章推荐※

3 条评论

发表评论 取消回复 使用cookie技术保留您的个人信息以便您下次快速评论，继续评论表示您已同意该条款

免费搭建 Hexo 博客： Github Pages 部署全攻略

发表评论取消回复
使用cookie技术保留您的个人信息以便您下次快速评论，继续评论表示您已同意该条款