对于每一个自己写过博客的同学来说,拥有自己的个人博客站点是一件很让人值得兴奋的事情,接下来就让我们一起来利用“Hexo + Github pages“搭建属于自己的个人博客吧……^^
先放一张搭建完成后的效果图给大家瞧瞧。
感兴趣的同学也可以前往溜达溜达。
1、安装Node.js()
因为 Hexo 是一个基于nodejs 的静态博客网站生成器,所以安装node.js是必不可少的。
2、安装git()
既然是基于Github pages搭建的Blog,安装Git肯定是必须的,安装好以后,直接通过指令即可将Hexo部署到 GitHub Pages。
如果有装Xcode的同学,此步可省略,因为Xcode自带有Git。
竟然 Node.js 和 Git 都已经安装好了,那么我们就可以开始安装Hexo了。
1、在本地建立一个文件夹,用户存放Hexo的配置文件,例如:Blog。
2、然后打开 终端(Terminal) 定位到 Blog 文件夹。
3、正式开始安装 hexo
执行命令:sudo npm install -g hexo
输入密码
4、初始化 Hexo
执行命令:hexo init
5、生成静态页面
执行命令:hexo generate
6、启动本地服务
执行命令:hexo server
浏览器输入
1、New repository
Repository name 固定写法为:
your_user_name.github.io
把 your_user_name 替换为你的用户名然后点击 Create repository 就可以了。
PS:因为我已经新建过了,所有会报错。
2、准备 Clone repository
在本地新建一个文件夹Backup,然后把Blog中的文件和文件夹都剪切到Backup中去,让Blog为空。
PS:这一步操作是为了Clone repository时不报错。
3、开始 Clone repository
clone到Blog文件夹中:
3、开始关联
把Backup中的文件和文件夹都剪切到Blog中去,然后就可以把Backup给delete了。
打开文件夹中的 _config.yml 文件:
翻到最后面:
修改deploy:
deploy:
type: git
repo: 填写你的repository clone地址
branch: master
保存并退出
push 一下 git
打开终端定位到Blog
执行 install 命令:
npm install hexo-deployer-git --save
执行部署命令:
hexo deploy
回到 Github 点击 Settings:
在浏览器打开这个链接:
看到下面这个界面,恭喜你,你的个人博客已经搭建成功了:
PS:每次部署都需要依次执行命令:
hexo clean
hexo generate
hexo deploy
既然是个人博客站点,当然要选一套符合自己气质的主题[]咯~
这里以我的为例:
- A white theme based on Landscape plus and Writing. -
安装:
git clone https://github.com/henryhuang/oishi.git themes/oishi
安装完成以后你会发现在你本地的 themes 文件夹中多了一个 oishi 文件夹
启用
修改设置文件 _config.yml,把 theme 的值设置为 oshi
这里可以修改一下 title 和 author 信息,改成你喜欢的就好了。
修改好以后重新部署(前面有写)一下,然后push一下git,就可以在你的个人博客站点上面看到符合你气质的主题效果了~