关于搭建我的博客

关于搭建我的博客的经历

最近闲来无事,并且刚好看到别人精美的博客,我就想着是时候重新搭建一个博客了。其实我之前已经有过一个同样用GitHub Pages配合Hexo搭建的博客,但因为我感觉不是很美观,再加上域名问题和换了个新电脑,所以又抛弃了。这次重新搭建博客也想着是时候重新开始我的新的编程经历,努力多写技术文章,记录我的生活。

一开始我想用Jekyll+Github Pages的方式来搭建,但在这过程中我踩了很多坑,所以放弃了这种方法,重新回到以前搭建博客的方式,就是Hexo(next主题)+Github Pages的方式。

一、环境搭建


既然使用Hexo和Github Pages的方式,那么就需要安装npm,Node.js和hexo了,安装这几者的过程不赘述了,最后可以检测下环境:

1
2
npm -v        // 我的是6.14.9版本
node -v // 我的是v14.15.3版本

接着是在Github上申请Github Pages,过程简单,只要创建一个新仓库,名字为“用户名.github.io”,就自动生成成功了,访问URL:用户名.github.io。如果对URL不满意,还可以设置域名,我是在阿里云上购买了新的域名,然后在阿里云控制台设置两个域名的绑定,然后在这个Github仓库的设置里的域名处添加新的域名,这样在Github仓库会生成一个CNAME文件,如果想在本地仓库也设置CNAME文件,在主题里创建一个一样的CNAME文件就行了。

next主题我没有使用官方的,因为我使用官方的主题会出现乱码的情况,所以我使用了别人优化过的next,具体网址是:https://github.com/iissnan/hexo-theme-next

二、搭建结构


在themes文件夹下可以新建一个next文件夹,然后使用git clone命令来下载next主题:

1
2
$ cd your-hexo-site
$ git clone https://github.com/iissnan/hexo-theme-next themes/next

注意有两个重要的配置文件,一个是在blog根目录下的站点配置文件_config.yml,一个是next文件夹下**主题配置文件 ** _config.yml,改动这两个文件的设置就可以改动博客。

现在在根目录下的cmd命令行,输入命令:

1
hexo clean & hexo g & hexo s

没有问题的话就可以在localhost:4000查看使用next主题的博客了。

接下来我们要添加博客的目录,比如归档archives,目录categories,标签tag和关于about等。在主题配置文件中的menu下一一打开,调整顺序,然后在cmd命令行中这样配置,以目录为例:

1
hexo new page categories

然后会在source下生成对应文件夹和md文件,在md文件中设置type:

1
type: "categories"

三、优化


关于博客的优化就有很多参考了,下面我就做一些主要优化的说明。


2. 头像


3. 链接


4. 字体


在配置文件中打开并设置

5. 动态背景


配置文件中打开

6. 评论


Gitalk设置,并且在GitHub中写自己配置的域名。