Hexo + Gitee 搭建个人博客
<section id="nice" style="font-size: 16px; color: rgba(0, 0, 0, 1); padding: 0 10px; line-height: 1.6; word-spacing: 0; letter-spacing: 0; word-wrap: break-word; text-align: left; font-family: Optima-Regular, Optima, PingFangSC-light, PingFangTC-light, "PingFang SC", Cambria, Cochin, Georgia, Times, "Times New Roman", serif; margin-top: -10px" data-tool="mdnice编辑器" data-website="https://www.mdnice.com"><h2 style="margin: 80px 10px 40px; text-align: center; font-weight: normal; color: rgba(63, 63, 63, 1); font-size: 140%" data-tool="mdnice编辑器"><span class="content">环境搭建</span></h2>
<ul style="margin-top: 8px; margin-bottom: 8px; padding-left: 25px; color: rgba(0, 0, 0, 1); list-style-type: disc" data-tool="mdnice编辑器">
<li>
<section style="margin-top: 5px; margin-bottom: 5px; line-height: 26px; text-align: left; color: rgba(1, 1, 1, 1); font-weight: 500">Git</section>
</li>
<li>
<section style="margin-top: 5px; margin-bottom: 5px; line-height: 26px; text-align: left; color: rgba(1, 1, 1, 1); font-weight: 500">Node.js
<ul style="margin-top: 8px; margin-bottom: 8px; padding-left: 25px; color: rgba(0, 0, 0, 1); list-style-type: square">
<li>
<section style="margin-top: 5px; margin-bottom: 5px; line-height: 26px; text-align: left; color: rgba(1, 1, 1, 1); font-weight: 500"><strong style="font-weight: bold; color: rgba(255, 53, 2, 1); line-height: 1.5; font-size: 16px"><span style="color: rgba(53, 179, 120, 1); font-weight: bold">最新的 Node.js 已经集成了 npm</span></strong></section>
</li>
</ul>
</section>
</li>
<li>
<section style="margin-top: 5px; margin-bottom: 5px; line-height: 26px; text-align: left; color: rgba(1, 1, 1, 1); font-weight: 500">npm</section>
</li>
</ul>
<blockquote style="display: block; font-size: 0.9em; overflow: auto; overflow-scrolling: touch; margin: 20px 0; color: rgba(91, 91, 91, 1); border-left: 3px solid rgba(158, 158, 158, 1); background: rgba(158, 158, 158, 0.1); padding: 10px 10px 10px 20px" data-tool="mdnice编辑器">
<p style="padding: 0; color: rgba(63, 63, 63, 1); line-height: 1.5; font-size: 16px; margin: 10px"><strong style="font-weight: bold; color: rgba(255, 53, 2, 1); line-height: 1.5; font-size: 16px">官网地址：</strong></p>
<ul style="margin-top: 8px; margin-bottom: 8px; padding-left: 25px; color: rgba(0, 0, 0, 1); list-style-type: disc">
<li>
<section style="margin-top: 5px; margin-bottom: 5px; line-height: 26px; text-align: left; color: rgba(1, 1, 1, 1); font-weight: 500">https://nodejs.org/en/</section>
</li>
<li>
<section style="margin-top: 5px; margin-bottom: 5px; line-height: 26px; text-align: left; color: rgba(1, 1, 1, 1); font-weight: 500">https://git-scm.com/</section>
</li>
</ul>
</blockquote>
<h2 style="margin: 80px 10px 40px; text-align: center; font-weight: normal; color: rgba(63, 63, 63, 1); font-size: 140%" data-tool="mdnice编辑器"><span class="content">开始搭建</span></h2>
<h3 style="margin: 40px 0 20px; font-weight: bold; line-height: 1.5; color: rgba(63, 63, 63, 1); font-size: 120%" data-tool="mdnice编辑器"><span class="content">1. 安装 Hexo</span></h3>
<pre class="custom" style="margin-top: 10px; margin-bottom: 10px; border-radius: 5px; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.55)" data-tool="mdnice编辑器"><code>npm install -g hexo # 通过npm安装hexo
# -g 指定全局安装，可以使用hexo命令</code></pre>
<h3 style="margin: 40px 0 20px; font-weight: bold; line-height: 1.5; color: rgba(63, 63, 63, 1); font-size: 120%" data-tool="mdnice编辑器"><span class="content">2. 初始化 Hexo</span></h3>
<pre class="custom" style="margin-top: 10px; margin-bottom: 10px; border-radius: 5px; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.55)" data-tool="mdnice编辑器"><code>hexo init blog # 初始化创建，会再桌面创建blog文件夹
cd blog # 进入blog目录
npm install # 进一步安装hexo所需文件</code></pre>
<p style="padding-top: 8px; padding-bottom: 8px; line-height: 1.6; color: rgba(63, 63, 63, 1); font-size: 16px; margin: 10px 0" data-tool="mdnice编辑器">初始化后，文件夹的目录如下：</p>
<pre class="custom" style="margin-top: 10px; margin-bottom: 10px; border-radius: 5px; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.55)" data-tool="mdnice编辑器"><code>.
├── .deploy #需要部署的文件
├── node_modules #Hexo插件
├── public #生成的静态网页文件
├── scaffolds #模板
├── source #博客正文和其他源文件等都应该放在这里
| ├── _drafts #草稿
| └── _posts #文章
├── themes #主题
├── _config.yml #全局配置文件
└── package.json</code></pre>
<h3 style="margin: 40px 0 20px; font-weight: bold; line-height: 1.5; color: rgba(63, 63, 63, 1); font-size: 120%" data-tool="mdnice编辑器"><span class="content">3. 启动 Hexo</span></h3>
<pre class="custom" style="margin-top: 10px; margin-bottom: 10px; border-radius: 5px; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.55)" data-tool="mdnice编辑器"><code>hexo clean # 清除所有记录 /hexo c
hexo generate # 生成静态网页 /hexo g
hexo server # 启动服务 /hexo s</code></pre>
<p style="padding-top: 8px; padding-bottom: 8px; line-height: 1.6; color: rgba(63, 63, 63, 1); font-size: 16px; margin: 10px 0" data-tool="mdnice编辑器">显示如下图，则运行成功。</p>
<figure style="margin: 10px 0" data-tool="mdnice编辑器"><img src="https://imgkr.cn-bj.ufileos.com/886a853c-7c50-4b12-9e7c-06682c09a122.png"></figure>
<p style="padding-top: 8px; padding-bottom: 8px; line-height: 1.6; color: rgba(63, 63, 63, 1); font-size: 16px; margin: 10px 0" data-tool="mdnice编辑器">然后使用浏览器访问 http://localhost:4000</p>
<figure style="margin: 10px 0" data-tool="mdnice编辑器"><img src="https://imgkr.cn-bj.ufileos.com/f49507b3-2d19-4472-beb6-7cb8754f0443.png"></figure>
<p style="padding-top: 8px; padding-bottom: 8px; line-height: 1.6; color: rgba(63, 63, 63, 1); font-size: 16px; margin: 10px 0" data-tool="mdnice编辑器">其实，如果你要求不高，我们再把它部署到码云（gitee）上，现在也可以说是完成了。</p>
<h3 style="margin: 40px 0 20px; font-weight: bold; line-height: 1.5; color: rgba(63, 63, 63, 1); font-size: 120%" data-tool="mdnice编辑器"><span class="content">4. 把博客部署到码云上</span></h3>
<blockquote style="display: block; font-size: 0.9em; overflow: auto; overflow-scrolling: touch; margin: 20px 0; color: rgba(91, 91, 91, 1); border-left: 3px solid rgba(158, 158, 158, 1); background: rgba(158, 158, 158, 0.1); padding: 10px 10px 10px 20px" data-tool="mdnice编辑器">
<p style="padding: 0; color: rgba(63, 63, 63, 1); line-height: 1.5; font-size: 16px; margin: 10px">首先说明一下，为什么选择码云，因为我也是通过 GitHub Page 实现的，不过最近 GitHub 经常性蹦，访问也比较慢，所以我就选择了码云实现一下，<strong style="font-weight: bold; color: rgba(255, 53, 2, 1); line-height: 1.5; font-size: 16px">当然你有服务器就最好不过了</strong>。</p>
</blockquote>
<p style="padding-top: 8px; padding-bottom: 8px; line-height: 1.6; color: rgba(63, 63, 63, 1); font-size: 16px; margin: 10px 0" data-tool="mdnice编辑器">码云（gitee）：<strong style="font-weight: bold; color: rgba(255, 53, 2, 1); line-height: 1.5; font-size: 16px">https://gitee.com/</strong></p>
<h4 style="margin-top: 30px; margin-bottom: 15px; font-weight: bold; color: rgba(0, 0, 0, 1); font-size: 18px" data-tool="mdnice编辑器"><span class="content">4.1 注册码云，创建仓库</span></h4>
<p style="padding-top: 8px; padding-bottom: 8px; line-height: 1.6; color: rgba(63, 63, 63, 1); font-size: 16px; margin: 10px 0" data-tool="mdnice编辑器">我们需要在 gitee 创建自己的账户（<strong style="font-weight: bold; color: rgba(255, 53, 2, 1); line-height: 1.5; font-size: 16px">如果没有</strong>），然后再创建一个自己仓库</p>
<figure style="margin: 10px 0" data-tool="mdnice编辑器"><img src="https://imgkr.cn-bj.ufileos.com/af2cef0a-0b91-46f6-9c2a-4683a18b4032.png"></figure>
<p style="padding-top: 8px; padding-bottom: 8px; line-height: 1.6; color: rgba(63, 63, 63, 1); font-size: 16px; margin: 10px 0" data-tool="mdnice编辑器">输入仓库名称，其它默认即可，<strong style="font-weight: bold; color: rgba(255, 53, 2, 1); line-height: 1.5; font-size: 16px">这里因为我已经创建了</strong>。 <img src="https://imgkr.cn-bj.ufileos.com/6e66ab5a-1c91-4a50-b693-83b7b6e5526e.png"></p>
<h4 style="margin-top: 30px; margin-bottom: 15px; font-weight: bold; color: rgba(0, 0, 0, 1); font-size: 18px" data-tool="mdnice编辑器"><span class="content">4.2 生成/添加 SSH 公钥</span></h4>
<p style="padding-top: 8px; padding-bottom: 8px; line-height: 1.6; color: rgba(63, 63, 63, 1); font-size: 16px; margin: 10px 0" data-tool="mdnice编辑器">码云 Gitee 、GitHub 提供了基于 SSH 协议的 Git 服务，在使用 SSH 协议访问仓库仓库之前，需要先配置好账户/仓库的 SSH 公钥。</p>
<p style="padding-top: 8px; padding-bottom: 8px; line-height: 1.6; color: rgba(63, 63, 63, 1); font-size: 16px; margin: 10px 0" data-tool="mdnice编辑器"><strong style="font-weight: bold; color: rgba(255, 53, 2, 1); line-height: 1.5; font-size: 16px">配置 ssh 账户和邮箱</strong></p>
<p style="padding-top: 8px; padding-bottom: 8px; line-height: 1.6; color: rgba(63, 63, 63, 1); font-size: 16px; margin: 10px 0" data-tool="mdnice编辑器">邮箱不必与 GitHub、Gitee 账号相同，个人邮箱即可。</p>
<pre class="custom" style="margin-top: 10px; margin-bottom: 10px; border-radius: 5px; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.55)" data-tool="mdnice编辑器"><code>git config --global user.email *********@qq.com # 设置邮箱
git config --global user.name '****' # 设置用户名</code></pre>
<p style="padding-top: 8px; padding-bottom: 8px; line-height: 1.6; color: rgba(63, 63, 63, 1); font-size: 16px; margin: 10px 0" data-tool="mdnice编辑器">查看账户和邮箱</p>
<pre class="custom" style="margin-top: 10px; margin-bottom: 10px; border-radius: 5px; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.55)" data-tool="mdnice编辑器"><code>git config --global user.name
git config --global user.email</code></pre>
<p style="padding-top: 8px; padding-bottom: 8px; line-height: 1.6; color: rgba(63, 63, 63, 1); font-size: 16px; margin: 10px 0" data-tool="mdnice编辑器"><strong style="font-weight: bold; color: rgba(255, 53, 2, 1); line-height: 1.5; font-size: 16px">本地生成ssh公钥</strong></p>
<p style="padding-top: 8px; padding-bottom: 8px; line-height: 1.6; color: rgba(63, 63, 63, 1); font-size: 16px; margin: 10px 0" data-tool="mdnice编辑器">邮箱为刚配置好的账户邮箱</p>
<pre class="custom" style="margin-top: 10px; margin-bottom: 10px; border-radius: 5px; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.55)" data-tool="mdnice编辑器"><code>ssh-keygen -t rsa -C "xxxxx@xxxxx.com"</code></pre>
<p style="padding-top: 8px; padding-bottom: 8px; line-height: 1.6; color: rgba(63, 63, 63, 1); font-size: 16px; margin: 10px 0" data-tool="mdnice编辑器">按照提示完成三次回车，即可生成 ssh key</p>
<figure style="margin: 10px 0" data-tool="mdnice编辑器"><img src="https://imgkr.cn-bj.ufileos.com/8c530f13-9af5-449b-9e9e-6cc750261f37.png"></figure>
<p style="padding-top: 8px; padding-bottom: 8px; line-height: 1.6; color: rgba(63, 63, 63, 1); font-size: 16px; margin: 10px 0" data-tool="mdnice编辑器"><strong style="font-weight: bold; color: rgba(255, 53, 2, 1); line-height: 1.5; font-size: 16px">查看 ssh 公钥</strong></p>
<pre class="custom" style="margin-top: 10px; margin-bottom: 10px; border-radius: 5px; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.55)" data-tool="mdnice编辑器"><code>vim ~/.ssh/id_rsa.pub
# 退出
:qa!</code></pre>
<p style="padding-top: 8px; padding-bottom: 8px; line-height: 1.6; color: rgba(63, 63, 63, 1); font-size: 16px; margin: 10px 0" data-tool="mdnice编辑器">复制公钥去 Gitee 粘贴，添加 <img src="https://imgkr.cn-bj.ufileos.com/4216e7a6-6100-4638-a63c-64c917d0c444.png"></p>
<blockquote style="display: block; font-size: 0.9em; overflow: auto; overflow-scrolling: touch; margin: 20px 0; color: rgba(91, 91, 91, 1); border-left: 3px solid rgba(158, 158, 158, 1); background: rgba(158, 158, 158, 0.1); padding: 10px 10px 10px 20px" data-tool="mdnice编辑器">
<p style="padding: 0; color: rgba(63, 63, 63, 1); line-height: 1.5; font-size: 16px; margin: 10px">说明一下：</p>
<ul style="margin-top: 8px; margin-bottom: 8px; padding-left: 25px; color: rgba(0, 0, 0, 1); list-style-type: disc">
<li>
<section style="margin-top: 5px; margin-bottom: 5px; line-height: 26px; text-align: left; color: rgba(1, 1, 1, 1); font-weight: 500"><strong style="font-weight: bold; color: rgba(255, 53, 2, 1); line-height: 1.5; font-size: 16px">GitHub、gitlab、码云三个平台可以使用一个公钥</strong></section>
</li>
</ul>
</blockquote>
<p style="padding-top: 8px; padding-bottom: 8px; line-height: 1.6; color: rgba(63, 63, 63, 1); font-size: 16px; margin: 10px 0" data-tool="mdnice编辑器"><strong style="font-weight: bold; color: rgba(255, 53, 2, 1); line-height: 1.5; font-size: 16px">测试是否连接成功</strong></p>
<p style="padding-top: 8px; padding-bottom: 8px; line-height: 1.6; color: rgba(63, 63, 63, 1); font-size: 16px; margin: 10px 0" data-tool="mdnice编辑器">码云 Gitee</p>
<pre class="custom" style="margin-top: 10px; margin-bottom: 10px; border-radius: 5px; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.55)" data-tool="mdnice编辑器"><code>ssh -T git@gitee.com</code></pre>
<p style="padding-top: 8px; padding-bottom: 8px; line-height: 1.6; color: rgba(63, 63, 63, 1); font-size: 16px; margin: 10px 0" data-tool="mdnice编辑器">如下图所示，则表示连接成功 <img src="https://imgkr.cn-bj.ufileos.com/8e671f4b-01b2-457e-89f4-3be91ffbad34.png"></p>
<p style="padding-top: 8px; padding-bottom: 8px; line-height: 1.6; color: rgba(63, 63, 63, 1); font-size: 16px; margin: 10px 0" data-tool="mdnice编辑器"><strong style="font-weight: bold; color: rgba(255, 53, 2, 1); line-height: 1.5; font-size: 16px">另外， GitHub 的测试代码如下:</strong></p>
<pre class="custom" style="margin-top: 10px; margin-bottom: 10px; border-radius: 5px; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.55)" data-tool="mdnice编辑器"><code>ssh -T git@github.com
# 表示连接成功
Hi “您的用户名”! You've successfully authenticated, but GitHub does not provide shell access.
</code></pre>
<h4 style="margin-top: 30px; margin-bottom: 15px; font-weight: bold; color: rgba(0, 0, 0, 1); font-size: 18px" data-tool="mdnice编辑器"><span class="content">4.3 配置连接 Gitee</span></h4>
<p style="padding-top: 8px; padding-bottom: 8px; line-height: 1.6; color: rgba(63, 63, 63, 1); font-size: 16px; margin: 10px 0" data-tool="mdnice编辑器">进入到我们新创建的仓库，复制项目地址</p>
<figure style="margin: 10px 0" data-tool="mdnice编辑器"><img src="https://imgkr.cn-bj.ufileos.com/58184ecf-7b9b-4c60-8582-69563e653e05.png"></figure>
<p style="padding-top: 8px; padding-bottom: 8px; line-height: 1.6; color: rgba(63, 63, 63, 1); font-size: 16px; margin: 10px 0" data-tool="mdnice编辑器">复制 URL ，到 hexo 的配置文件 <code style="word-wrap: break-word; margin: 0 2px; background: rgba(248, 245, 236, 1); font-family: Operator Mono, Consolas, Monaco, Menlo, monospace; word-break: break-all; color: rgba(255, 53, 2, 1); line-height: 1.5; font-size: 90%; padding: 3px 5px; border-radius: 2px">_config.yml</code>，相应位置修改成如下：</p>
<pre class="custom" style="margin-top: 10px; margin-bottom: 10px; border-radius: 5px; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.55)" data-tool="mdnice编辑器"><code>deploy:
type: git # type为git
repo: git@gitee.com:XXXXXX/blog.git # 仓库的 URL
branch: master</code></pre>
<blockquote style="display: block; font-size: 0.9em; overflow: auto; overflow-scrolling: touch; margin: 20px 0; color: rgba(91, 91, 91, 1); border-left: 3px solid rgba(158, 158, 158, 1); background: rgba(158, 158, 158, 0.1); padding: 10px 10px 10px 20px" data-tool="mdnice编辑器">
<p style="padding: 0; color: rgba(63, 63, 63, 1); line-height: 1.5; font-size: 16px; margin: 10px"><strong style="font-weight: bold; color: rgba(255, 53, 2, 1); line-height: 1.5; font-size: 16px">注意：冒号后面一定要有空格，否则不能正确识别。</strong></p>
</blockquote>
<h4 style="margin-top: 30px; margin-bottom: 15px; font-weight: bold; color: rgba(0, 0, 0, 1); font-size: 18px" data-tool="mdnice编辑器"><span class="content">4.4 部署博客</span></h4>
<p style="padding-top: 8px; padding-bottom: 8px; line-height: 1.6; color: rgba(63, 63, 63, 1); font-size: 16px; margin: 10px 0" data-tool="mdnice编辑器">安装自动部署发布工具，不然部署会报错</p>
<pre class="custom" style="margin-top: 10px; margin-bottom: 10px; border-radius: 5px; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.55)" data-tool="mdnice编辑器"><code>npm install hexo-deployer-git --save</code></pre>
<p style="padding-top: 8px; padding-bottom: 8px; line-height: 1.6; color: rgba(63, 63, 63, 1); font-size: 16px; margin: 10px 0" data-tool="mdnice编辑器">新建 deployer.sh 文件，输入代码：</p>
<pre class="custom" style="margin-top: 10px; margin-bottom: 10px; border-radius: 5px; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.55)" data-tool="mdnice编辑器"><code>hexo clean
hexo g
hexo d</code></pre>
<p style="padding-top: 8px; padding-bottom: 8px; line-height: 1.6; color: rgba(63, 63, 63, 1); font-size: 16px; margin: 10px 0" data-tool="mdnice编辑器">一键部署博客</p>
<pre class="custom" style="margin-top: 10px; margin-bottom: 10px; border-radius: 5px; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.55)" data-tool="mdnice编辑器"><code>sh deployer.sh</code></pre>
<h3 style="margin: 40px 0 20px; font-weight: bold; line-height: 1.5; color: rgba(63, 63, 63, 1); font-size: 120%" data-tool="mdnice编辑器"><span class="content">5. Gitee Pages 设置</span></h3>
<p style="padding-top: 8px; padding-bottom: 8px; line-height: 1.6; color: rgba(63, 63, 63, 1); font-size: 16px; margin: 10px 0" data-tool="mdnice编辑器">在项目的服务中选择 Pages 选项</p>
<figure style="margin: 10px 0" data-tool="mdnice编辑器"><img src="https://imgkr.cn-bj.ufileos.com/5944ddc0-3c68-4d5d-86dc-da3d29b4cbb6.png"></figure>
<p style="padding-top: 8px; padding-bottom: 8px; line-height: 1.6; color: rgba(63, 63, 63, 1); font-size: 16px; margin: 10px 0" data-tool="mdnice编辑器">默认配置，点击启动即可</p>
<figure style="margin: 10px 0" data-tool="mdnice编辑器"><img src="https://imgkr.cn-bj.ufileos.com/d983ed3a-f2e9-4207-8cc6-39ab5564282c.png"></figure>
<p style="padding-top: 8px; padding-bottom: 8px; line-height: 1.6; color: rgba(63, 63, 63, 1); font-size: 16px; margin: 10px 0" data-tool="mdnice编辑器">下图则成功开启，记住博客地址，之后可以点更新进行操作</p>
<figure style="margin: 10px 0" data-tool="mdnice编辑器"><img src="https://imgkr.cn-bj.ufileos.com/1c1b49ba-5d4b-46aa-8835-5cff8091c120.png"></figure>
<p style="padding-top: 8px; padding-bottom: 8px; line-height: 1.6; color: rgba(63, 63, 63, 1); font-size: 16px; margin: 10px 0" data-tool="mdnice编辑器"><strong style="font-weight: bold; color: rgba(255, 53, 2, 1); line-height: 1.5; font-size: 16px">博客发布成功之后，可以访问博客地址：xxxxxx，就可通过他提供的博客地址进行访问，预览在线博客啦！！</strong></p>
<p style="padding-top: 8px; padding-bottom: 8px; line-height: 1.6; color: rgba(63, 63, 63, 1); font-size: 16px; margin: 10px 0" data-tool="mdnice编辑器">如果博客的样式不对，则需要在_config.yml中配置下博客地址和路径：</p>
<pre class="custom" style="margin-top: 10px; margin-bottom: 10px; border-radius: 5px; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.55)" data-tool="mdnice编辑器"><code>url: “码云提供给您的博客地址”
root: /</code></pre>
<p style="padding-top: 8px; padding-bottom: 8px; line-height: 1.6; color: rgba(63, 63, 63, 1); font-size: 16px; margin: 10px 0" data-tool="mdnice编辑器">再执行命令 <code style="word-wrap: break-word; margin: 0 2px; background: rgba(248, 245, 236, 1); font-family: Operator Mono, Consolas, Monaco, Menlo, monospace; word-break: break-all; color: rgba(255, 53, 2, 1); line-height: 1.5; font-size: 90%; padding: 3px 5px; border-radius: 2px">sh deployer.sh</code> 就可以啦，之后就是美化我们的博客了。</p>
<h3 style="margin: 40px 0 20px; font-weight: bold; line-height: 1.5; color: rgba(63, 63, 63, 1); font-size: 120%" data-tool="mdnice编辑器"><span class="content">6. 主题配置</span></h3>
<p style="padding-top: 8px; padding-bottom: 8px; line-height: 1.6; color: rgba(63, 63, 63, 1); font-size: 16px; margin: 10px 0" data-tool="mdnice编辑器">下载自己喜欢的主题，可以去 github 下载压缩包然后<strong style="font-weight: bold; color: rgba(255, 53, 2, 1); line-height: 1.5; font-size: 16px">放到博客项目根目录下的 themes 中</strong>。</p>
<p style="padding-top: 8px; padding-bottom: 8px; line-height: 1.6; color: rgba(63, 63, 63, 1); font-size: 16px; margin: 10px 0" data-tool="mdnice编辑器">然后配置 <strong style="font-weight: bold; color: rgba(255, 53, 2, 1); line-height: 1.5; font-size: 16px">_config.yml</strong></p>
<pre class="custom" style="margin-top: 10px; margin-bottom: 10px; border-radius: 5px; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.55)" data-tool="mdnice编辑器"><code>theme: “您的主题文件夹完整名称”
# 这里需要注意:后面要有一个空格，名称要和theme下的主题目录名称相同。</code></pre>
<p style="padding-top: 8px; padding-bottom: 8px; line-height: 1.6; color: rgba(63, 63, 63, 1); font-size: 16px; margin: 10px 0" data-tool="mdnice编辑器">修改完成，本地运行 <code style="word-wrap: break-word; margin: 0 2px; background: rgba(248, 245, 236, 1); font-family: Operator Mono, Consolas, Monaco, Menlo, monospace; word-break: break-all; color: rgba(255, 53, 2, 1); line-height: 1.5; font-size: 90%; padding: 3px 5px; border-radius: 2px">hexo s</code> 测试成功即可上传部署到 Gitee 然后点击更新即可。</p>
<h3 style="margin: 40px 0 20px; font-weight: bold; line-height: 1.5; color: rgba(63, 63, 63, 1); font-size: 120%" data-tool="mdnice编辑器"><span class="content">7. 自定义域名</span></h3>
<p style="padding-top: 8px; padding-bottom: 8px; line-height: 1.6; color: rgba(63, 63, 63, 1); font-size: 16px; margin: 10px 0" data-tool="mdnice编辑器">经过上面操作，我们用 Hexo 搭建好自己的 Blog 后，我选择了托管在码云上,现在通过 https://xx0817.gitee.io/blog 这个地址就可以访问了。但是我想通过自己的域名进行访问，要实现这个功能。</p>
<h4 style="margin-top: 30px; margin-bottom: 15px; font-weight: bold; color: rgba(0, 0, 0, 1); font-size: 18px" data-tool="mdnice编辑器"><span class="content">7.1 购买域名</span></h4>
<p style="padding-top: 8px; padding-bottom: 8px; line-height: 1.6; color: rgba(63, 63, 63, 1); font-size: 16px; margin: 10px 0" data-tool="mdnice编辑器">这里不多说，某里云、某讯云、某为云都可以，看自己喜欢。</p>
<h4 style="margin-top: 30px; margin-bottom: 15px; font-weight: bold; color: rgba(0, 0, 0, 1); font-size: 18px" data-tool="mdnice编辑器"><span class="content">7.2 域名解析</span></h4>
<p style="padding-top: 8px; padding-bottom: 8px; line-height: 1.6; color: rgba(63, 63, 63, 1); font-size: 16px; margin: 10px 0" data-tool="mdnice编辑器">我们需要通过 GitHub 网址 ping 出服务器的 IP 地址。可以在本地 cmd 中 ping。也可以在网站上 ping。</p>
<p style="padding-top: 8px; padding-bottom: 8px; line-height: 1.6; color: rgba(63, 63, 63, 1); font-size: 16px; margin: 10px 0" data-tool="mdnice编辑器">我选择网站 ping。</p>
<p style="padding-top: 8px; padding-bottom: 8px; line-height: 1.6; color: rgba(63, 63, 63, 1); font-size: 16px; margin: 10px 0" data-tool="mdnice编辑器">网站：<strong style="font-weight: bold; color: rgba(255, 53, 2, 1); line-height: 1.5; font-size: 16px">http://ip.tool.chinaz.com/</strong></p>
<p style="padding-top: 8px; padding-bottom: 8px; line-height: 1.6; color: rgba(63, 63, 63, 1); font-size: 16px; margin: 10px 0" data-tool="mdnice编辑器">访问后输入自己的 GitHub 部署的博客网址就能 ping 出来了。</p>
<figure style="margin: 10px 0" data-tool="mdnice编辑器"><img src="https://imgkr.cn-bj.ufileos.com/64102110-6c58-442b-b84f-31f6049cc755.png"></figure>
<p style="padding-top: 8px; padding-bottom: 8px; line-height: 1.6; color: rgba(63, 63, 63, 1); font-size: 16px; margin: 10px 0" data-tool="mdnice编辑器">进入域名购买的控制台，在解析中添加记录：</p>
<figure style="margin: 10px 0" data-tool="mdnice编辑器"><img src="https://imgkr.cn-bj.ufileos.com/3fac4c75-c146-4258-8080-02856321ff7d.png"></figure>
<p style="padding-top: 8px; padding-bottom: 8px; line-height: 1.6; color: rgba(63, 63, 63, 1); font-size: 16px; margin: 10px 0" data-tool="mdnice编辑器">添加记录：</p>
<p style="padding-top: 8px; padding-bottom: 8px; line-height: 1.6; color: rgba(63, 63, 63, 1); font-size: 16px; margin: 10px 0" data-tool="mdnice编辑器">主机记录为@，记录类型为A，解析线路选择默认，记录值设置为上面ping出来的IP地址。最少要设置一个，我是四个全部设置了。</p>
<figure style="margin: 10px 0" data-tool="mdnice编辑器"><img src="https://imgkr.cn-bj.ufileos.com/9f0ab269-17ce-4c40-afc2-4bfca90cf410.png"></figure>
<p style="padding-top: 8px; padding-bottom: 8px; line-height: 1.6; color: rgba(63, 63, 63, 1); font-size: 16px; margin: 10px 0" data-tool="mdnice编辑器">再添加记录：</p>
<p style="padding-top: 8px; padding-bottom: 8px; line-height: 1.6; color: rgba(63, 63, 63, 1); font-size: 16px; margin: 10px 0" data-tool="mdnice编辑器">主机记录为www，记录类型为 CNAME，解析线路选择默认，记录值为你的 GitHub 域名，我的为 gdfuturexx.github.io。</p>
<figure style="margin: 10px 0" data-tool="mdnice编辑器"><img src="https://imgkr.cn-bj.ufileos.com/a0a33911-a735-4fbd-8a2f-8a3bdbb05321.png"></figure>
<p style="padding-top: 8px; padding-bottom: 8px; line-height: 1.6; color: rgba(63, 63, 63, 1); font-size: 16px; margin: 10px 0" data-tool="mdnice编辑器">上面设置的意思为：</p>
<ul style="margin-top: 8px; margin-bottom: 8px; padding-left: 25px; color: rgba(0, 0, 0, 1); list-style-type: disc" data-tool="mdnice编辑器">
<li>
<section style="margin-top: 5px; margin-bottom: 5px; line-height: 26px; text-align: left; color: rgba(1, 1, 1, 1); font-weight: 500">设置 A 记录的意思是，当我输入 hongxin.online 这个域名的时候，访问的是 185.199.110.153等这4个IP地址其中一个；</section>
</li>
<li>
<section style="margin-top: 5px; margin-bottom: 5px; line-height: 26px; text-align: left; color: rgba(1, 1, 1, 1); font-weight: 500">设置 CNAME 的意思是，当我访问 gdfuturexx.github.io 这个地址的时候，会跳转到 hongxin.online，之后的过程就和 A 记录相同了，即访问 185.199.110.153等4个IP地址其中一个。</section>
</li>
</ul>
<h4 style="margin-top: 30px; margin-bottom: 15px; font-weight: bold; color: rgba(0, 0, 0, 1); font-size: 18px" data-tool="mdnice编辑器"><span class="content">7.3 添加CNAME文件</span></h4>
<p style="padding-top: 8px; padding-bottom: 8px; line-height: 1.6; color: rgba(63, 63, 63, 1); font-size: 16px; margin: 10px 0" data-tool="mdnice编辑器">在Hexo本地文件夹的source文件夹中，增加一个名为CNAME的无后缀文件。</p>
<p style="padding-top: 8px; padding-bottom: 8px; line-height: 1.6; color: rgba(63, 63, 63, 1); font-size: 16px; margin: 10px 0" data-tool="mdnice编辑器">如果你想地址栏中显示www就输入www.xxx.com，否则输入xxxx.com（你的域名）就行。</p>
<p style="padding-top: 8px; padding-bottom: 8px; line-height: 1.6; color: rgba(63, 63, 63, 1); font-size: 16px; margin: 10px 0" data-tool="mdnice编辑器">之后重新部署即可。</p>
<h4 style="margin-top: 30px; margin-bottom: 15px; font-weight: bold; color: rgba(0, 0, 0, 1); font-size: 18px" data-tool="mdnice编辑器"><span class="content">7.4 GitHub Pages 绑定域名</span></h4>
<p style="padding-top: 8px; padding-bottom: 8px; line-height: 1.6; color: rgba(63, 63, 63, 1); font-size: 16px; margin: 10px 0" data-tool="mdnice编辑器">登录你的GitHub，进入仓库，打开设置。</p>
<p style="padding-top: 8px; padding-bottom: 8px; line-height: 1.6; color: rgba(63, 63, 63, 1); font-size: 16px; margin: 10px 0" data-tool="mdnice编辑器">找到下图位置，在 Custom domain 添加你的自定义域名。</p>
<p style="padding-top: 8px; padding-bottom: 8px; line-height: 1.6; color: rgba(63, 63, 63, 1); font-size: 16px; margin: 10px 0" data-tool="mdnice编辑器">之后刷新一下页面，如果 能勾选Enforce HTTPS就要勾选上。如果不勾选的话访问域名会显示不安全。</p>
<figure style="margin: 10px 0" data-tool="mdnice编辑器"><img src="https://imgkr.cn-bj.ufileos.com/cfe512a5-d535-422b-af76-addb6701a3e5.png"></figure>
<blockquote style="display: block; font-size: 0.9em; overflow: auto; overflow-scrolling: touch; margin: 20px 0; color: rgba(91, 91, 91, 1); border-left: 3px solid rgba(158, 158, 158, 1); background: rgba(158, 158, 158, 0.1); padding: 10px 10px 10px 20px" data-tool="mdnice编辑器">
<p style="padding: 0; color: rgba(63, 63, 63, 1); line-height: 1.5; font-size: 16px; margin: 10px">自定义域名这段参考了：<strong style="font-weight: bold; color: rgba(255, 53, 2, 1); line-height: 1.5; font-size: 16px">sushan102.top</strong>，这个网站中的文章</p>
</blockquote>
<h2 style="margin: 80px 10px 40px; text-align: center; font-weight: normal; color: rgba(63, 63, 63, 1); font-size: 140%" data-tool="mdnice编辑器"><span class="content">严格声明</span></h2>
<ul style="margin-top: 8px; margin-bottom: 8px; padding-left: 25px; color: rgba(0, 0, 0, 1); list-style-type: disc" data-tool="mdnice编辑器">
<li>
<section style="margin-top: 5px; margin-bottom: 5px; line-height: 26px; text-align: left; color: rgba(1, 1, 1, 1); font-weight: 500">
<p style="padding-top: 8px; padding-bottom: 8px; line-height: 1.6; color: rgba(63, 63, 63, 1); font-size: 16px; margin: 10px 0"><strong style="font-weight: bold; color: rgba(255, 53, 2, 1); line-height: 1.5; font-size: 16px">本项目涉及的代码及一系列分析过程，仅用于学习交流，切勿用于任何非法用途，后果自当。</strong></p>
</section>
</li>
<li>
<section style="margin-top: 5px; margin-bottom: 5px; line-height: 26px; text-align: left; color: rgba(1, 1, 1, 1); font-weight: 500">
<p style="padding-top: 8px; padding-bottom: 8px; line-height: 1.6; color: rgba(63, 63, 63, 1); font-size: 16px; margin: 10px 0"><strong style="font-weight: bold; color: rgba(255, 53, 2, 1); line-height: 1.5; font-size: 16px">未经本人同意，禁止以任何形式，在任何渠道，私自转发或盗文</strong></p>
</section>
</li>
</ul>
<blockquote style="display: block; font-size: 0.9em; overflow: auto; overflow-scrolling: touch; margin: 20px 0; color: rgba(91, 91, 91, 1); border-left: 3px solid rgba(158, 158, 158, 1); background: rgba(158, 158, 158, 0.1); padding: 10px 10px 10px 20px" data-tool="mdnice编辑器">
<p style="padding: 0; color: rgba(63, 63, 63, 1); line-height: 1.5; font-size: 16px; margin: 10px"><strong style="font-weight: bold; color: rgba(255, 53, 2, 1); line-height: 1.5; font-size: 16px">若要转载请注明出处，尊重他人劳动成果。</strong></p>
</blockquote>
<p style="padding-top: 8px; padding-bottom: 8px; line-height: 1.6; color: rgba(63, 63, 63, 1); font-size: 16px; margin: 10px 0" data-tool="mdnice编辑器"><strong style="font-weight: bold; color: rgba(255, 53, 2, 1); line-height: 1.5; font-size: 16px"><span style="color: rgba(255, 69, 0, 1); font-weight: bold">转载请注明出处链接 </span>: <span style="color: rgba(14, 136, 235, 1); font-weight: bold">https://www.cnblogs.com/yizhixue-hx/</span></strong></p>
</section><br><br>
来源：https://www.cnblogs.com/yizhixue-hx/p/12638361.html
頁:
[1]