Windows/Linux 下使用 hexo+github+NexT 主题建立个人博客网站

  按照建站惯例(误),本网站的第一篇博客为建站过程,作为记录,以备之后查阅。

1 注册Github

  本博客没有租用个人服务器,所以需要借助github,注意如果后续没有购买域名的话,最终个人博客的网址将是“xxxx.github.io”,其中“xxxx”即是你的github账号名,所以尽量取个喜欢的名字吧。点击Github注册。

2 安装Git

  Windows:需要下载Git客户端,安装完成以后再安装目录下git-bash.exegit-cmd.exegit-gui.exe。在此建议使用git-bash,模拟了bash环境,可以使用大部分unix的标准命令。建议更改git-bash.exe的管理员权限,避免莫名其妙的权限问题。右键点击git-bash.exe,依次选择属性→兼容性→以管理员身份运行此程序→确定。

图1

图2

  Linux:直接在终端中安装git,如ubuntu

1
sudo apt-get install git

  然后在git-bash或打开中终端中配置

1
2
git config --global user.name "自定义名字"
git config --global user.email "邮箱"

3 创建Github Pages

  Github Pages 是面向用户、组织和项目开放的公共静态页面搭建托管服务,站点被免费托管在GitHub,可以使用Github Pages默认提供的域名github.io 或者另外购买域名来发布站点。

3.1 创建repository

  首先在Github新建一个repository,即点击右上角的加号,选择New repository

新建仓库

  这里的repository name必须是 xxxx.github.io其中xxxx为你的github账号用户名。其他的默认就可以了。

3.2 克隆repository到本地

  如果之前没有SSH KEY的话需要先创建SSH KEY可以参考这里

  在上一步建好的repository的右上角点击Clone or download,使用clone with SSH,点击出现连接的右边按钮,复制SSH地址。

克隆仓库

  然后在本地电脑的合适位置新建一个文件夹用于存放本地repository,进入建好的文件夹,Windows用户右键选择打开git-bash.exe,Linux用户就右键打开终端,然后在终端中粘贴刚才复制的SSH地址,回车执行。

3.3 推送本地改动到github上

  在刚才文件夹的写一个简单的html文件

1
“hello world!”

  然后在终端中执行

1
2
3
git add .
git commit -m
git push

  此时访问xxxx.github.io即可看到刚才的hello world网页。

4 安装环境&&创建本地博客

  环境安装主要是Nodejshexo,Windows下具体可参考安装Node.js安装hexo。Linux下和安装其他软件没有区别。

  安装完环境以后,新建一个文件夹作为本地博客的目录,然后在该文件夹下右键打开git-bash或终端,依次输入以下指令

1
hexo init && hexo g && hexo s

  其中hexo g 即为hexo generate别名,同理hexo shexo server别名。

  此时可以打开浏览器输入网站localhost:4000查看默认的博客。

5 部署到Github Pages

  首先安装hexo-deployer-git,注意还是在本地博客文件夹下打开的git-bash键入以下命令

1
npm install hexo-deployer-git --save

  修改博客文件夹根目录下的网站配置文件_config.yml中的deploy配置,注意冒号后有一个空格

1
2
3
4
deploy:
type: git
repo: git@github.com:xxxx/xxxx.github.io.git #3.2步骤中克隆仓库的SSH地址
branch: master #分支,一般用 master 即可

  保存修改后在git-bash或终端中键入

1
hexo d

  这里hexo dhexo deploy别名。

6 使用NexT主题

  可选的主题有很多,在这里下载到各种官方主题

  本站主题是基于NexT主题 v6.4.2版本,下载链接在这里,后续文章将详细记录对主题如何配置和修改来达到和本站一样的效果。

  下载主题的压缩包以后,将其解压到博客根目录下的theme文件夹下,并命名为next

  然后在网站的配置文件_config.yml中将theme字段的值修改为next,同样注意冒号后有一个空格,下文不再赘述。

1
theme: next

  此时重新生成静态文件,重启服务器

1
hexo c && hexo g && hexo s

  即可在本地端口localhost:4000中查看新主题下的网站

next主题

  如果对主题没有定制化需求的话,那么此时直接进行部署就可以了。

1
hexo d

  如果想定制得和本网站类似的话,可以参考关于主题配置修改的后续博客。

-------- 本文结束 感谢阅读 --------
给我加块红烧肉吧
  • 本文标题: Windows/Linux 下使用 hexo+github+NexT 主题建立个人博客网站
  • 本文作者: Chou Bin
  • 创建时间: 2019年12月30日 - 15时12分
  • 修改时间: 2019年12月30日 - 23时12分
  • 本文链接: http://yoursite.com/2019/12/30/HowToBuildABlog/
  • 版权声明: 本博客所有文章除特别声明外,均采用 CC BY-NC-SA 4.0 许可协议。转载请注明出处!