拥有一个自己的博客是属于每一个男人的梦想。

某篇曾经看到的博文, 某个不知名的博主


假期闲着没事干,正好手里有一台腾讯云的机子,于是就想到了去搭建一个属于自己的博客。最初我选用了使用人数最为广泛的Wordpress。确实,Wordpress配合宝塔控制面板的话搭建简单,同时区块编辑器对小白来说十分友好,均为图形化操作,并且还有着大量的插件和丰富的主题。但是因为我服务器是一核2G的小水管,还有大量其他的服务跑着,所以我把目光转向了静态博客(可以托管在GitHub或Gitee上)。在浏览过了大量的博客后,Hexo由其高度的定制性、个性化被我选定。

Hexo搭建步骤

环境搭建

安装Node.js

因为Hexo是一款基于Node.js的静态博客框架,所以首先要安装Node.js。

  1. 官网地址:node.js,下载最新的对应系统版安装包安装即可

  2. 安装完后,打开命令行检查安装是否成功


<!--code0-->

  1. 安装npm,用以下载Hexo和相关主题、插件

    <!--code1-->

    > <!--code2-->

    <!--code3-->

安装git并连接GitHub

Git是目前世界上最先进的分布式版本控制系统,可以有效、高速的处理从很小到非常大的项目版本管理。
而Hexo就使用git来进行管理和发布。

安装git

在Windows上使用Git,可以从Git官网直接下载安装程序,然后按默认选项安装即可。

安装完成后,在开始菜单里找到“Git”->“Git Bash”,蹦出一个类似命令行窗口的东西,就说明Git安装成功!

在git bush中输入git –version来查看一下版本


$ git --version # 确认Git安装成功:运行命令查看版本号
git version 2.33.0.windows.2 # 笔者是旧版本,安装最新版本即可


连接GitHub

  1. 注册GitHub账户

GitHub官网注册账户。

  1. 设置username和email

 $ git config --global user.name “XXXXXX" # 你的GitHub登陆名
$ git config --global user.email “xxx@xxx.com” # 你的GitHub注册邮箱


  1. 连接git与github

$ ssh-keygen -t rsa -C “xxx@xxx.com” # xxx@xxx.com是你自己注册GitHub的邮箱


到C:\Users\用户名.ssh\下查看是否有id_rsa和id_rsa.pub这两个文件,id_rsa.pub里的内容就是你的密钥

  1. 接下来到GitHub上,打开“Settings”-“SSH and GPG keys”页面,然后点击“New SSH Key”,填上Title(随意写),在Key文本框里粘贴 id_rsa.pub文件里的全部内容。
  2. 验证是否成功,在git bash里输入下面的命令

$ ssh -T git@github.com
Hi XXXXXX! You've successfully authenticated, but GitHub does not provide shell access. # XXXXXX是你的GitHub用户名


GitHub建立部署

GitHub创建个人仓库

进入GitHub,点击右上角的+号,点击New repository

Repository name处填入自己的仓库名称XXX.github.io
注意要选择Public,即公开仓库,否则你的网页是无法访问的
勾选上README初始化
其他默认即可

安装hexo

创建一个blog文件夹,注意:之后的操作都在blog文件夹内进行,如果出错删除该文件夹后重新进行即可。
在blog文件夹内右键,点击 git bash here\

# 全局安装
$ npm install hexo-cli -g

# 查看hexo版本
$ hexo -v
hexo-cli: 4.3.0
os: win32 10.0.22000
node: 14.16.1
...... # 安装成功

# 初始化博客
$ hexo init blog
# 在本地预览博客
$ hexo s


完成后,在浏览器地址栏中输入localhost:4000,就可看到Hexo内置的第一篇博文Hallo world。

常用的Hexo 命令

  • npm install hexo -g # 安装Hexo
  • npm update hexo -g # 升级
  • hexo init # 初始化博客

命令简写

  • hexo n “我的博客” == hexo new “我的博客” # 新建文章

  • hexo g == hexo generate # 生成

  • hexo s == hexo server # 启动服务预览

  • hexo d == hexo deploy # 部署

  • hexo server # Hexo会监视文件变动并自动更新,无须重启服务器

  • hexo server -s # 静态模式

  • hexo server -p 5000 # 更改端口

  • hexo server -i 192.168.1.1 # 自定义 IP

  • hexo clean # 清除缓存,若是网页正常情况下可以忽略这条命令

发布博客

上面只是在本地预览,接下来要做的就是就是推送网站,也就是发布网站,让我们的网站可以被更多的人访问。在设置之前,需要解释一个概念,在blog根目录里的_config.yml文件称为站点配置文件,如下图

下一步将我们的Hexo与GitHub关联起来,打开站点的配置文件_config.yml,翻到最后修改为:\

_config.yml

# Deployment
## Docs: https://hexo.io/docs/one-command-deployment


​ deploy:
​ type: git
​ repo: <https://github.com/XXXXXX/XXX.github.io.git> **# 记得添加.git后缀**
​ branch: main

最后安装Git部署插件,输入命令:

​    npm install hexo-deployer-git --save

接着,分别输入这三条命令:

​    $ hexo clean 
​ $ hexo g
​ $ hexo d

完成后,打开浏览器,在地址栏输入你的放置个人网站的仓库路径,即 http://xxxx.github.io ,
你就会发现你的博客已经上线了,可以在网络上被访问了。

绑定域名

此时的网址还是GitHub的xxxx.github.io,想要个性化的我们自然不会就这么算了,我们可以绑定属于自己的域名到GitHub的服务器上。

  1. 首先进入自己域名的管理台,进入解析,删除原有的解析。添加两条解析记录:
    1. 记录类型:CNAME 主机记录:www 记录值:xxxx.github.io
    2. 记录类型:A 主机记录:@ 记录值:IP # IP通过命令行ping xxxx.github.io可以得到
  2. 登录GitHub,进入之前创建的仓库,点击”Settings”-“Pages”,在Custom domain处填入你的域名,save保存,GitHub会自动给你配置TLS证书(可能比较慢),等一段时间后,可以开启强制https。
  3. 进入本地博客文件夹 ,进入blog/source目录下,创建一个记事本文件,输入你的域名(不需要带www),保存,命名为CNAME ,注意保存成所有文件而不是txt文件。如下图:


完成这三步后,依次输入\


hexo clean
hexo g
hexo d


现在你就可以用你自己的域名访问自己的网站了!

更换主题

Hexo有大量的个性化主题可以使用 本博客使用的是Butterfly主题,就以此主题作为示例进行演示。

  1. 下载主题

git clone -b master https://github.com/jerryc127/hexo-theme-butterfly.git themes/butterfly


现在,主题文件就被你下载到了blog目录的themes主题下的butterfly文件夹中。
2. 打开站点的_config.yml配置文件,修改主题为butterfly

_config.yml

# Extensions

## Plugins: <https://hexo.io/plugins/>

## Themes: <https://hexo.io/themes/>

theme: butterfly

现在再去看你的博客,就会发现它已经变成了你想要的样子。

下次具体讲讲butterfly主题的配置,如果对这个主题并不感兴趣可以跳过这篇文章。
另外,有机会的话我也会略微提一下wordpress的搭建,不过这类教程网上已经很多了,所以如果需求多的话我就写一下吧。
感谢您的阅读。

引用
git连接github完整教程
GitHub+Hexo 搭建个人网站详细教程