注册GitHub账号
在GitHub官网使用邮箱注册账号
登录之后点击New repository按钮
新建new repository
创建完成之后,进入设置页面选择主题
找到下图所示的地方
选择一个主题(这里我选择第一个)
主题选择之后,在浏览器地址栏输入idea007.github.io(你前面设置的名字)即可打开
补充说明
1 | 尽管GitHub个人网站项目是免费的,但还是有一些限制的,不过对大多数人来说,完全够用了。 |
绑定域名
因为域名要花钱购买,这个地方暂时不展开说明,感兴趣可查看下面的参考文档
使用Hexo主题
GitHub上搭建好博客网站部分,在网页部分主要通过上传开源的项目文件先直接部署以正常显示,或者直接跳过使用GitHub生成的主题。所以,在本章我们来详细讲解用Hexo部署开源博客网站,以及日常如何写博客文章等。
1. 搭建环境
由于GitHub有些功能依赖Git实现,而Hexo是基于Node.js实现的,所以在开始前需要安装好Git、Node.js、Hexo,并了解一些相关基础知识。
- Git、GitHub相关教程(http://www.runoob.com/git/git-tutorial.html)
- Node.js相关教程(http://www.runoob.com/nodejs/nodejs-tutorial.html)
- Hexo官方中文文档(https://hexo.io/zh-cn/docs/)
1.1 安装Git
安装Git For Windows(或者其它git客户端),官网下载地址 https://git-scm.com/downloads ,和其他软件一样,没什么特别,就不说了。
1.2 安装Node.js
安装Node.js,官网下载地址 https://nodejs.org/en/ ,也是正常安装即可。
1.3 安装Hexo
上面的环境配置成功以后,你就可以通过cmd命令行使用npm来安装Hexo了。只需输入下面的一行命令,等待安装完成。
1 | $ npm install -g hexo-cli |
安装之后检查
2. 初始化Hexo
2.1 初始化
在电脑上新建一个文件夹hexo用例存放跟hexo相关文件
然后命令行操作
1 | $ cd /xxx/xxx/hexo/ |
2.2 生产静态文件
1 | //命令行依然在hexo文件夹下 |
2.3 启动服务预览
启动服务,就可以在本地打开 http://localhost:4000/ 预览了,出现下图证明Hexo安装成功。
1 | $ hexo s |
3.更换喜欢的主题
3.1 下载主题
按Ctrl+C关闭server服务器,然后在官网 或者 https://github.com/hexojs/hexo/wiki/Themes 选择需要的主题。
我博客使用的主题为NexT(https://github.com/iissnan/hexo-theme-next ),以此为例。
1 | $ git clone https://github.com/iissnan/hexo-theme-next themes/next |
3.2 启用主题
修改hexo目录下的_config.yml配置文件中的theme属性,将其设置为上面的next。具体操作为,打开创建的Hexo目录下的_config.yml这个配置文件,然后找到# Extensions这个关键字,下面有theme: landscape这一行,把这一行改为theme: next即可。修改设置后,如果在浏览器中没有看到想要的效果,使用($ hexo clean)来清除缓存,然后重新生成静态文件。
1 | $ hexo clean |
4.配置SSh keys
4.1 检查现有的SSH密钥
检查目录是否已经有一个公共SSH密钥,公共密钥的文件名一般为 id_dsa.pub 或 id_ecdsa.pub 或 id_ed25519.pub 或 id_rsa.pub。
4.2 第一次使用Git创建新SSH密钥
执行下面命令生成SSH,敲三次回车,既可以生成id_rsa.pub文件,里面就是SSH keys的内容。
1 | $ ssh-keygen |
4.3 配置SSH keys到GitHub
- 打开文件管理器(就是平时打开我的电脑的文件夹),找到C:\Users\frank\ .ssh\id_rsa.pub这个文件,用记事本打开,复制里面的内容。
- 打开你的github官网,登陆后点击右上角头像弹出下拉栏里,点击Setting进入设置,点击SSH and GPG keys设置,点击New SSH keys添加刚刚复制的SSH密钥,Title备注自己能分清楚就好。
检验SSH是否配置好
1
$ ssh -T git@github.com
5. 部署到GitHub
Hexo 提供了快速方便的一键部署功能,第一次配置好之后只需一条命令就能将网站部署到服务器上。
5.1安装hexo-deployer-git
1 | $ npm install hexo-deployer-git --save |
5.2 修改_config.yml配置
repo:
配置_config.yml如下
5.3 把本地博客部署到GitHub
在上传网站到GitHub前,最好先清除缓存($ hexo clean),然后重新生成静态文件($ hexo g),最后再上传部署($ hexo d)。到此,新主题的博客已经发布成功了。
1 | $ hexo clean |
6. 创建和发布
6.1创建新文章
1 | $ cd /xxx/xxx/hexo/ |
创建之后可以选择自己喜欢的markdown工具进行编辑
6.2 发布
1 | $ hexo clean |
6.3预览结构
参考文档
可能会遇到的问题
git遇到的问题之“Please make sure you have the correct access rights and the repository exists.”