盒子
盒子
文章目录
  1. 0.Hexo
    1. 0.1 简介
  2. 1.搭建准备工作
  3. 2.安装NodeJs
  4. 3.安装Hexo
  5. 4.开始搭建博客
  6. 5.push到github
  7. 6.如何使用theme
  8. Extensions
    1. Plugins: https://hexo.io/plugins/
  9. 7.如何绑定自己的域名到github
    1. 7.1 如何让自己的域名添加上https协议
    2. 7.2 一个更好的https协议加密方式
  10. 8.未填埋的坑
    1. 8.1 此坑已填

利用hexo在github上搭建简单博客的入坑记

  一开始是想利用worldpress在自己的服务器上搭建博客的,但界面过于丑陋且不便于维护,再加上美帝的服务器只有一年的使用时间,所以我选择了在github上通过建立仓库的形式搭建博客。
寻找了一圈,发现常用的是jekyllHexo两种便捷的github博客搭建框架,尝试一圈后发现,jekll也比较难看,所以最后入了hexo的坑。

0.Hexo

0.1 简介

  Hexo 是一款基于Node.js、快速、简洁且高效的博客框架。Hexo 使用 Markdown(或其他渲染引擎)解析文章,在几秒内,即可利用靓丽的主题生成静态网页。

1.搭建准备工作

1、安装git或者github desktop
2、准备NodeJs安装包。

2.安装NodeJs

  我使用了默认的安装,安装过程中选择自动添加环境变量,省去自行添加环境变量的麻烦,此步不会的请自行百度google

3.安装Hexo

1、打开cmd,进入NodeJs安装目录;
2、利用npm命令安装hexo即可:

1
npm install -g hexo

4.开始搭建博客

1、自行选择一个目录(任意目录即可),创建一个文件夹,例如我在D盘创建了一个blog空文件夹;
2、进入文件夹,并执行以下语句,初始化hexo:

1
hexo init

3、安装依赖包:

1
npm install

4、利用theme模版生成网页,生成文件在/public文件夹里,index.html是主页:

1
hexo g

5、在本地建立临时服务器,可查看网页效果:

1
hexo s

访问http://localhost:4000即可看到你的博客。

5.push到github

1、在github上建立repository,命名为xxx.github.io(xxx是你的用户名);
2、在本地clone一个repository;
或者
在github desktop上建立一个本地的repository,命名为xxx.github.io,然后publish上去即可。
3、把blog/public(blog是刚才你自己新建的文件夹名称)里的文件复制到本地的xxx.github.io文件夹中,push到github即可。

6.如何使用theme

  从各种渠道可以获取到hexo的主题,下载zip压缩包到本地,并可以自行命名文件夹(例如我把新的主题命名为fexo)。
  将文件夹拷贝到blog/theme目录下,更新blog目录下的_config.yml文件中:

Extensions

Plugins: https://hexo.io/plugins/

##Themes: https://hexo.io/themes/
theme: fexo
  更改theme标签,例如我要使用的新标签fexo,记住冒号“:”之后有空格。
  最后,更改主题根目录下的_config.yml文件相关信息,重新生成网页,即可得到自己的网页。

7.如何绑定自己的域名到github

  方法其实很简单,在本地得xxx.github.io根目录下新建一个txt文件,文件里写不带http开头的域名,例如:jiacy.top。重命名文件为“CNAME”,并去掉后缀名。
  另外,需要在自己的域名解析中添加两条cname记录。
  主机记录分别填:@和www
  记录值填:xxx.github.io
  等待记录生效即可。

7.1 如何让自己的域名添加上https协议

  这里再次用到第三方服务,Netlify提供了一个加密协议,把github上的xxx.github.io库引导到这个网站上,此网站会生成一个新的网址,例如我的是jiacy.netlify.com。
  此时,更改之前的cname记录值为:jiacy.netlify.com
  再次等待记录生效即可。
  具体流程参看写代码的猴子的帖子。

7.2 一个更好的https协议加密方式

  尝试过Netlify和Cloudflare两家不同的免费证书提供商,希望同时做到自定义IPv4地址、指定域名邮箱服务器、使用www和不加www的裸露域名、使用HTTPS协议加密等四项功能,但发现了以下问题:

  • 阿里云:自定义一个A类的IPv4地址 + 指定域名邮箱服务器
  • Cloudflare:自定义IPv4地址 + 指定域名邮箱服务器 + 使用www和不加www的裸露域名 + 使用HTTPS协议加密
  • Netlify:自定义IPv4地址 + 指定域名邮箱服务器 + 使用www和不加www的裸露域名 + 使用HTTPS协议加密

  所以,我最终选择了Cloudflare服务器解析我的域名。但途中遇到了大坑,曾经尝试过使用Netlify的DNS,更改域名的解析服务器后,在Netlify的域名管理中添加了一个MX值、一个CNAME的邮箱服务器、两个A类的IPv4地址,并尝试用两个CNAME值指向jiacy061.github.io域名,但保存记录后,反复出现短暂能正确解析jiacyer.com域名的情况,始终无法长时间稳定解析我的域名。

  • 值得注意的是,Cloudflare的DNS的A类记录需要关掉后面橙色的云标志,不然会解析到Cloudflare的服务器地址上。

  最终解决所有问题,成功解析了所有的记录。

8.未填埋的坑

  虽然我也是使用的框架,但hexo g的时候生成的网页并不能同时生成about和categories等index.html,暂时未解决此坑,欢迎各位交流经验。

8.1 此坑已填

  最后,我根据fexo主题官方文档完成了填坑工作,这里就不细讲了。

转载请注明出处,无偿提供。

支持一下
感谢大佬们的支持