一开始是想利用worldpress在自己的服务器上搭建博客的,但界面过于丑陋且不便于维护,再加上美帝的服务器只有一年的使用时间,所以我选择了在github上通过建立仓库的形式搭建博客。
寻找了一圈,发现常用的是jekyll和Hexo两种便捷的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即可:
4.开始搭建博客
1、自行选择一个目录(任意目录即可),创建一个文件夹,例如我在D盘创建了一个blog空文件夹;
2、进入文件夹,并执行以下语句,初始化hexo:
3、安装依赖包:
4、利用theme模版生成网页,生成文件在/public文件夹里,index.html是主页:
5、在本地建立临时服务器,可查看网页效果:
访问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主题官方文档完成了填坑工作,这里就不细讲了。
转载请注明出处,无偿提供。