0%

用hexo+Next模板+GithubPage快速建立个人博客

发表于

前言

本文章主要介绍hexo博客的搭建，Next模板添加与相关设置
今天又重新捣鼓了一遍hexo博客，升级后发现还是有很多不同，这之间也踩了挺多坑，这边就一并说一下
本文所有命令可以在Windows Terminal中操作，这是微软新的命令行终端，比cmd强大，美观不少，官方商店就可以下载。
所有相关配置在VS Code上更改

正文

hexo博客初搭建

NodeJs安装

hexo中许多拓展都要用npm，后文要用
下载完之后添加到环境变量

正式安装

首先，创建一个文件夹，本文中为Blog，然后cd进去
执行下面命令安装hexo
npm install hexo-cli -g
安装完毕后执行命令
hexo init Blog
npm install
这时你会在文件夹中看到新增许多文件，这样就安装完成了，然后执行
hexo s
这时在命令行中会给出一段链接，进入网址即可查看网站效果，现在你已完成大部分准备工作了
下面安装Next
clone https://github.com/theme-next/hexo-theme-next.git

主题切换至Next

用VS Code打开Blog文件，在根目录下打开_config.yml文件，在底端可找到theme键，配置如下
theme: next
然后进入
~/Blog/theme/next/_config.yml
Next有4个分支主题，VS Code中按Ctrl+F搜索scheme，可发现有4个主题，这里可选择自己喜欢的
这里可一一预览进行选择

主题配置

  • 网页总设置
    进入网站配置，在开头分别填网站标题，作者，语言(zh-CN)
  • 头像
    将头像图片放在
    ~/Blog/theme/next/source/images（此为图片路径）
    然后在主题配置中更改avatar，并将图片路径填上
  • 网站标签页图片
    在主题配置中找到favicon配置前两个就行（samll和medium）
    这些是比较基础的配置，后续我会单独写一篇文章说说几个常用配置

网站关联Github

网站关联github后可不用服务器，仅需域名即可（需花钱注册）
首先在github上建个库，名字一定要遵循
你的Github用户名 + .github.io
进入库设置，里面找到custom domain改为你的域名
域名解析到你的你的库名（上面）
然后回到网站配置，末尾改为： 

1
2
3
4
deploy:
  type: 'git'
  repository: git@github.com:username/username.github.io.git //username是github用户名
  branch: master

进入~/Blog/source,创建CNAME文件，无后缀，里面填域名
回到Blog文件夹下，分别执行：

1
2
3
hexo clean //清理缓存
hexo g //生成静态页面
hexo d //网站push到github上

然后就大功告成了

最后

这是我第一次用md写博客，排版可能有问题
文中还有一些没说到，下个文章我会说完
文中不足或错误之处，多请各大佬指正