GitHub + Hexo 搭建个人博客网站
一、准备工作
1. GitHub
+ Hexo
的优势
Hexo
提供现成的模板和模块;github
的 pages
功能提供免费的服务器,零成本搭建属于自己的博客。
2. 需要了解的网站
- github,开源代码托管网站,需要我们去注册一个账号。
- hexo,一个快速、简洁且高效的博客框架,需要我们去提前了解一些搭建文档。
- git,本地安装
git
工具,实现代码提交和推送。 - nodejs,本地安装
nodejs
,Hexo
基于nodejs
编写的。以上安装软件操作,请自行搜索
二、github
上创建仓库
1. 新建仓库
2. 填写地址
仓库名称为 <用户名>.github.io
,勾上 Add a README file
。
提示,用户名为你自己的
github
帐号,见下图。
3. 访问
访问地址 https://<用户名>.github.io
,如图则说明创建成功。
三、本地安装 Hexo
,生成博客模板
1. 安装 Hexo
打开cmd,执行
npm install -g hexo-cli |
查看 Hexo
版本
hexo -v |
执行结果如下
PS C:\Users\Administrator> hexo -v |
2. 创建本地博客
切换到工作区域文件夹下,执行
hexo init github-blog |
执行结果如下
PS D:\workspace\blog> hexo init github-blog |
然后初始化
cd github-blog |
安装好后运行,执行
hexo g |
执行结果
PS D:\workspace\blog\github-blog> hexo g |
浏览器打开 http://localhost:4000/
预览,如下图
四、提交本地博客至 github
仓库
有两种方式
1. 利用 Hexo
的部署插件
安装 hexo-deployer-git
npm install hexo-deployer-git -D |
安装完之后修改根目录的 _config.yml
文件,拉到最下面,增加远程仓库地址(自己的),记得保存(ctrl + s
)。
deploy: |
提示,远程仓库地址选择
ssh
的,如下图,HTTPS
的貌似还需要token
(主要是我加完token也没成功。。。)
部署到GitHub
hexo g -d |
执行成功后,查看 github
代码仓是否更新,查看博客地址页面。
2. 直接将 public
目录中的文件和目录推送至 gitHub
仓库
可参考我的博客 Git使用记录 - 持续更新 - 将本地项目关联到远程仓库。
记得是 public
目录,不是整个项目。如果你把整个项目推送了过去,记得回退。
5. 主题配置
在 github
上搜索 Hexo theme
,选择自己喜欢的主题,最好选择有详细文档的,这样安装比较方便。以我选择的 hexo-theme-butterfly 为例,具有 Demo
演示和详情的文档说明,只需按照文档来安装和配置即可。
参照 安装文档 进行安装配置,基础效果如下
按照文档进行其他配置,最后推送至远端仓库即可。
然后开始写作欣赏你自己的博客吧!
本博客所有文章除特别声明外,均采用 CC BY-NC-SA 4.0 许可协议。转载请注明来自 唯之为之!
评论
ValineGitalk