新建一个git 仓库
首先在 GitHub 上新建一个空仓库, 名称就是「你的用户名.github.io」,(注意!!!仓库的名字的正确格式是github用户名.github.io,之前没仔细看,随便起了个,果断报错。)
此时,你可以得到这个仓库的以git@github.com开头的仓库地址,记住这个仓库地址,后面要用到。
什么是Hexo?
hexo 是一个快速,简洁且高效的博客框架。也就是说,利用hexo你可以迅速的搭建出一个属于自己的漂亮博客。
安装Hexo
下面来说以下具体安装步骤:
- 安装前提
- Node.js
- Git
首先你需要确保自己的系统已经安装了 node 和 git , git官方下载,node官方下载。 如果你的电脑已经安装了上述必备程序,那么接下来就可以开始安装Hexo了。
npm instal -g hexo-cli
安装完毕之后,执行以下命令,hexo 就会在指定的文件夹中新建所需要的文件,如下命令执行之后则会新建了一个myBlog文件,且hexo会在myBlog中新增所需要的文件
hexo init myBlog
cd myBlog
init i
此时,你会发现自己的电脑中会出现一个myBlog文件夹,里面包括很多文件:
_config.yml:
这个文件里面是网站的配置信息,你可以在里面设置各种参数来改编网站的配置。如:
title: 网站标题
subtitle: 网站副标题
description: 网站描述
author: 你的名字
url: 网址
theme:网站主题
......
package.json
这个文件包含了应用程序的信息
scaffolds
模版文件夹。当您新建文章时,Hexo 会根据 scaffold 来建立文件。 Hexo的模板是指在新建的markdown文件中默认填充的内容。例如,如果您修改scaffold/post.md中的Front-matter内容,那么每次新建一篇文章时都会包含这个修改。
source
资源文件夹是存放用户资源的地方。除 _posts 文件夹之外,开头命名为 _ (下划线)的文件 / 文件夹和隐藏的文件将会被忽略。Markdown 和 HTML 文件会被解析并放到 public 文件夹,而其他文件会被拷贝过去。
themes
主题文件夹。Hexo 会根据主题来生成静态页面。
新建第一篇博客文章
-
输入命令:hexo new 开博大吉,此时你会看到一个md文件路径:
INFO Created: ~/Documents/myBog/source/_posts/开博大吉.md打开这个md 文件并编辑它,编辑完成之后保存。
-
打开文件 _config.yml并编辑:
将title改成你想要的网站名字, author改成你的大名, 最后一行的type 改成 type:git, 并在type的下面一行增加:repo: 文章第一步所生成的仓库地址 -
安装git部署插件
npm install hexo-deployer-git --save -
部署网站
hexo deploy -
预览博客:
进入「你的用户名.github.io」对应的 repo,打开 GitHub Pages 功能,如果已经打开了,就直接点击预览链接,此时你就可以看到自己的博客了!完美!
给博客换一个主题
可能你不喜欢当前这个主题,没关系,换!
- hexo主题集合
- 在上面的主题中随便挑一个主题,并进入它的github主页,如 NexT,然后复制它的 SSH 地址或 HTTPS 地址:https://github.com/iissnan/hexo-theme-next.git
cd themesgit clone https://github.com/iissnan/hexo-theme-next.gitcd ..- 将 _config.yml 的第 75 行改为 theme: hexo-theme-next,保存
hexo generatehexo deploy- 再等待一分钟,刷新博客就可以看到新的主题了!完美!
上传源代码到Github
注意:因为「你的用户名.github.io」上保存的只是你的博客,并没有保存「生成博客的程序代码」,你需要再创建一个名为 blog-generator 的空仓库,用来保存 myBlog 里面的「生成博客的程序代码」。
在github上新建一个 blog-generator 的空仓库,并按照它的提示命令进行即可。
这样的话,你的博客代码就保存在了「你的用户名.github.io」,而生成博客的代码则保存在了 blog-generator中,这样数据就不会丢失了。