使用hexo在github上搭建免费博客
命令速记
1 | # 写博客 |
前置技能
必备技能:
- git和github使用(Level 1)
- markdown(Level 2)
进阶技能:
- nodejs
- npm
- ejs
- sass
- yml
环境准备
安装Nodejs
如果还没有安装,可以参考这篇文章Windows/Linux下安装nodejs
安装hexo
1 | npm i -g hexo |
安装git
git客户端和一个github账户,网上教程很多这里就不细说了
开始创建博客
在本地初始化hexo目录(需要以管理员身份运行终端)
我这里用的目录名是
myBlog
,可修改成你喜欢的名字
1 | hexo init myBlog |
如果提示自动安装失败 进入博客目录,如果存在package-lock.json
删除,运行:
1 | npm i |
恭喜,博客已经建好了,我们来生成一下看看效果
1 | # 生成 |
访问http://localhost:4000
试试吧
配置hexo
hexo的配置都在_config.yml
中,这里介绍几个常用的配置
title
: 网站标题author
: 作者language
: 语言,是html5中声明的语言,中文是zh-cn
url
: 网站地址permalink
: 固定链接,默认/年/月/日/theme
: 主题deploy
: 部署信息(后面专门谈这个)
先把把基础的标题、作者、网址信息修改下
写博客
hexo n <新文件名>
1 | hexo n my-first-blog |
会在source/_post下面生成my-first-blog.md
文件
1 |
|
主题
在hexo主题列表,可以找到很多优秀的主题,下载到themes目录里,再把_config.yml
中的theme
换成对应的主题目录名即可使用
例如:
下载主题catman
1 | cd themes |
打开_config.yml
,修改主题为catman
1 | theme: catman |
打开/themes/catman/_config.yml
查看该主题的配置项,一般包括栏目显示、侧边栏设置、统计代码等等,这里依照每个主题不同会有区别,一般在主题的github中会有详细说明,这里就不赘述了
留言
因为hexo博客没有后台,是不能直接留言的,一般使用第三方留言,推荐使用搜狐畅言
(经过备案的域名才能使用)
将留言的js放入模板的留言模块即可使用了,一般模板都留有留言位置,可以看看模板的github页面介绍
部署到github上
首先要在github建立一个新的项目,我这里以myBlog
为例
打开_config.yml
,按下例填入你的项目地址,注意尽量使用ssh地址,不然每次都要输入密码
1 | deploy: |
安装git部署工具
1 | npm i --save hexo-deployer-git |
开始部署
1 | hexo d |
tips: 部署前记得先生成,使用
hexo d -g
可以一步生成+部署
第一次部署,需要登录github,启动page
settings 找到GitHub Pages,选择gh-pages分支,启动
使用自己的域名
在博客的source目录内新建文件CNAME
,填写要绑定的域名
将域名的cname解析为GitHub Pages的地址
生成、部署,等一会就可以用自己的域名访问了
图床
把图片直接放github国内直接访问会比较慢,可以放到国内的图床,这里推进使用(七牛云)[https://portal.qiniu.com]
注册、登录 -> 对象存储(左侧) -> 新建存储空间
建好空间后,空间概览中的测试域名
就是可以被外部访问的地址
内容管理、上传一个文件,使用测试域名
/文件名 即可访问
免费版本不支持CNAME,只能用测试域名
访问,限制流量、速度、1G空间,不过对于一个博客来说足够用了
另外七牛提供了高效的命令行管理工具qshell
,可以查看文档:命令行工具(qshell)