GitHub + Hexo 搭博客

使用github+hexo搭建免费个人博客

2017-09-03  本文已影响2人  奕玄

注:本文搭建的是静态博客,且托管于github

一、准备工作

1. 拥有一个github账号,没有就注册一个

2. 安装Node.jsnpm,npm的用处看这里,其实npm已经内置在了Node.js中,只需安装Node.js即可

3. 安装git客户端

ps:查看Node.js、npm、git版本。打开Git Bash,

$ node -v

$ npm -v

$ git --version

这三条命令可查看相应的版本


二、创建仓库

      新建一个名为username.github.io的仓库,username是你现今的用户名,以后绑定或不绑定域名,都可通过username.github.io来访问博客


三、配置SSH Key

Why:

      我们在本地写博客、编写代码,最终要提交到服务器上去,怎样建立一种本地与服务器的连接呢?可以使用github用户名和密码,但这有些繁琐且不安全,所以用到SSH Key来建立加密连接。

How:

1. 首先检查本机有没有SSH Key,

$ cd ~/.ssh

若提示:No such file or directory ,则说明你是第一次使用git;

2.

$ ssh-keygen -t rsa -C "邮件地址"

然后连续回车3次来生成SSH Key,生成的文件在用户目录下(用户目录在git窗口中有提示),找到.ssh\id_rsa.pub文件后,用记事本打开并复制里面的所有内容,接着打开你的github主页,进入个人设置 -> SSH and GPG keys -> New SSH key,粘贴到Key内容框中,Title框中可写明该SSH Key的用处,保存即可;(邮件地址为你的github邮箱)

3.

$ ssh -T git@github.com

出现"Are you sure you want to continue connecting (yes/no)?"后,输入yes,当你看到"Hi 'username'! You've successfully authenticated, but GitHub does not provide shell access."时,说明你的SSH已经配置成功;(username为你的用户名)

4.

$ git config --global user.name "你的username"

$ git config --global user.email "你的github邮箱"

进行配置。


四、使用hexo写博客

1. hexo是一种创建静态博客的框架,下载及学习文档请访问官网

2. 在本机创建一个文件夹作为个人博客的根目录,以后所有的文件都放在该文件夹下,包括hexo框架。使用npm下载hexo时,先cd到该文件夹下,再

$ npm install hexo-cli -g

进行下载安装。

3.

$ hexo -v

以查看hexo的版本,

$ hexo init

进行初始化。

4.

$ hexo clean

可简写为

$ hexo c

用于清除缓存文件 (db.json) 和已生成的静态文件 (public)。

在某些情况(尤其是更换主题后),如果发现您对站点的更改无论如何也不生效,您可能需要运行该命令。

5.

$ hexo generate

可简写为

$ hexo g

用于生成静态文件。

6.

$ hexo server

可简写为

$ hexo s

用于启动本地预览服务器。默认情况下,访问网址为http://localhost:4000/

7.

$ hexo deploy

可简写为

$ hexo d

用于部署网站,即将代码上传到github上。

注意:部署网站之前,须确保_config.yml配置文件中有关deploy的配置正确:

deploy:

      type: git

      repository: https://github.com/username/username.github.io.git

      branch: master

(username是你的用户名);

且还需要下载一个插件,

$ npm install hexo-deployer-git --save

8. 更换主题,eg:先

$ git clone https://github.com/giscafer/hexo-theme-cafe.git themes/cafe

然后将_config.yml配置文件的theme: landscape改为theme: cafe。所有的主题都将保存在themes文件夹下。请看官方主题

9.

$ hexo new "postname"

新建文章,postname为文章的名称。所有的文章都将保存在source文件夹下的_posts中。文章是以.md文件形式保存,在.md文件的顶部设置categoriestags字段可将文章分类、添加标签,不过这些都是可选的。

10.

$ hexo new page "pagename"

新建页面,pagename为页面的名称。新建页面将保存在source文件夹下。

11. 组合命令:

$ hexo s -g

生成静态页面并预览,

$ hexo d -g

生成静态页面并上传。

12. 如何让博文不全部显示(默认全部显示),而是显示博文的摘要呢?解决方法是在博文适当的位置加上<!--more-->

13. 创建的个人博客有两种配置文件,一种是根目录下的_config.yml,还有就是每个主题中的_config.yml。有关命令和配置详情请参见官方文档


五、最终效果

可以参见我的个人博客 https://getwang.github.io/,我用的是 NexT.Pisces 主题


六、参考

1. http://www.cnblogs.com/zhcncn/p/4097881.html

2. http://www.cnblogs.com/liuxianan/p/build-blog-website-by-hexo-github.html

3. http://www.jianshu.com/p/05289a4bc8b2

上一篇下一篇

猜你喜欢

热点阅读