vlambda博客
学习文章列表

GitHub+Hexo搭建个人博客基础教程(纯小白向)

第二部分:GitHub账号注册登录及使用教程

一、注册并登陆GitHub账号(推荐使用谷歌浏览器)

注册网址: https://github.com/

注意:不要用qq邮箱,收不到认证邮件。

二、在GitHub上新建一个仓库

1、登陆新注册的GitHub账号后,点击网页右上角的「New repository」

2、填写仓库名,格式必须是「你的 http://username.github.io」才能被识别(也就是一个邮箱只能有一个仓库)

GitHub+Hexo搭建个人博客基础教程(纯小白向)

3、绑定自己的域名,之前直接输入“ http://username.github.io”是可以访问的,不知道是不是最近服务器又被偷了,不能访问了,但是绑定自己的域名是可以访问的,参照之前的文章-,在GitHub绑定域名方法如下:

①、进入你的仓库,点击最后的设置。

GitHub+Hexo搭建个人博客基础教程(纯小白向)

拉到后面,看到custom domain,填入你的域名,加不加www,都可以。

GitHub+Hexo搭建个人博客基础教程(纯小白向)

第三部分:Hexo环境及模板安装,搭建独立站

1、下载安装Notepad++,网上随便下载一个就好,

GitHub+Hexo搭建个人博客基础教程(纯小白向)

2、安装Node.js软件(版本至少是nodejs 6.9,最好安装最新版本的),就像正常安装软件一样,都是默认选项,一直点下一步,完成安装。 

下载网址: https://nodejs.org/en/

GitHub+Hexo搭建个人博客基础教程(纯小白向)

最后安装好之后,按Win+R打开本机“运行”,输入cmd,点击确定,输入node -vnpm -v,如果出现版本号,那么就安装成功了。

GitHub+Hexo搭建个人博客基础教程(纯小白向)

GitHub+Hexo搭建个人博客基础教程(纯小白向)

3、安装Git软件

GitHub+Hexo搭建个人博客基础教程(纯小白向)

在根目录下点击鼠标右键“Git Bash Here”,输入命令 "git --version",出现版本号,表明安装成功。

GitHub+Hexo搭建个人博客基础教程(纯小白向)

GitHub+Hexo搭建个人博客基础教程(纯小白向)

4、安装Hexo

在根目录下新建一个文件夹(名称为英文,简短一些,我新建的名称是username),点击鼠标右键“Git Bash Here”, 打开git的控制台窗口,以后我们所有的操作都在Git控制台进行,就不要用Windows自带的控制台了。

官方网址: https://hexo.io/

GitHub+Hexo搭建个人博客基础教程(纯小白向)

定位到该目录下,输入 npm install hexo-cli -g,安装Hexo(鼠标右键粘贴)。会有几个报错,无视它就行,出现如下信息,表示安装成功了。

GitHub+Hexo搭建个人博客基础教程(纯小白向)

初始化文件夹,输入 hexo init <目录名>,我这里输入的就是hexo init username,等待一会儿。

GitHub+Hexo搭建个人博客基础教程(纯小白向)

最后出现“INFO  Start blogging with Hexo!”表明安装成功。可以看到之前的空文件夹,已经有文件了。

GitHub+Hexo搭建个人博客基础教程(纯小白向)

输入 cd <文件夹名称>,切换到文件夹的控制台,我这里输入的是 cd username,可以看到上面的路径,从根目录变成了文件夹的路径,

然后输入npm install 继续安装。

GitHub+Hexo搭建个人博客基础教程(纯小白向)

目前已经基本安装好了, 输入“ hexo g”生成静态页面,然后再输入“hexo s”,运行一下看一下,浏览器输入下面红框内的网址,注意直接用鼠标右键复制,不要按“Ctrl+C”,如果按了“Ctrl+C”,就直接停止了,看不到结果了。

GitHub+Hexo搭建个人博客基础教程(纯小白向)

GitHub+Hexo搭建个人博客基础教程(纯小白向)

浏览器内输入 http://localhost:4000/,看到的就是安装好的主题。

GitHub+Hexo搭建个人博客基础教程(纯小白向)

5、将博客发布到GitHub Page上

①、按“Ctrl+C”,先停止本地浏览,再安装一个插件,在命令行输入 npm install hexo-deployer-git --save (注意git后面有一个空格)。

GitHub+Hexo搭建个人博客基础教程(纯小白向)

②、将本地Git和GitHub关联起来,命令行输入 ssh-keygen -t rsa -C "GitHub注册时的邮箱",一直回车三次,生成SSH密钥。

GitHub+Hexo搭建个人博客基础教程(纯小白向)

开始,点击,打开个人文件夹,找到.SSH文件夹,鼠标右键,打开 id_rsa.pub 文件夹,建议使用Notepad++打开,把密钥全部复制

GitHub+Hexo搭建个人博客基础教程(纯小白向)

GitHub+Hexo搭建个人博客基础教程(纯小白向)

GitHub+Hexo搭建个人博客基础教程(纯小白向)

回到GitHub,点击头像,点击Settings。

GitHub+Hexo搭建个人博客基础教程(纯小白向)

选择SSH and GPG keys

GitHub+Hexo搭建个人博客基础教程(纯小白向)

点击 New SSH key

GitHub+Hexo搭建个人博客基础教程(纯小白向)

粘贴刚才的密钥,title可以随意填写,点击Add SSH key。

GitHub+Hexo搭建个人博客基础教程(纯小白向)

然后回命令行,检查是否连接成功。

输入命令, ssh -T [email protected] 等一会儿,出现如下界面,表明连接成功。

GitHub+Hexo搭建个人博客基础教程(纯小白向)

命令hexo g 是生成静态网页, 命令 hexo d 是发布到GitHub,连在一起的命令是 hexo g -d ,表示生成静态网页并发布到GitHub上。

③、修改一下hexo站点的配置文件,打开博客配置文件。

GitHub+Hexo搭建个人博客基础教程(纯小白向)

拉到最后面,添加几行语言,注意,英文冒号,且后面有一个空格,username要替换成你的GitHub用户名。

  type: git

  repo: [email protected]:username/username.github.io.git

  branch: master

④、最后把URL换成你的GitHub网址,http://username.github.io

⑤、点击保存,Git控制台输入命令 hexo g 生成静态网页。

推荐阅读