经常看到大牛的博客非常的高大帅气, 虽然我很渣, 但是逼格不能输, 所以有了以下的搭建记录.
我的成果 http://ninwoo.top/ , 喜欢的可以参考下面的记录一起来动手搞起来.
安装 Git Bash
访问 https://git-scm.com/downloads 下载最新版本的 git bash
安装完成之后, 右键打开 git bash, 设置用户名和邮件信息
- git config --global user.name "你的 GitHub 用户名"
- git config --global user.email "你的 GitHub 注册邮箱"
生成 ssh 秘钥文件
ssh-keygen -t rsa -C "GitHub 注册邮箱"
直接三个回车即可, 默认不需要设置密码.
查看生成的公钥
cat ~/.ssh/id_rsa.pub
复制内容, 打开 github setting keys https://github.com/settings/keys 界面, 创建新的 SSH key, 并粘贴公钥到 Key 输入框中.
在 git bash 中测试是否配置成功
ssh git@github.com
出现:
- PTY allocation request failed on channel 0
- Hi Ninwoo! You've successfully authenticated, but GitHub does not provide shell access.
- Connection to github.com closed.
证明设置成功.
创建 GitHub 仓库
创建新的仓库, 仓库名为 [用户名].github.io, 用户名用 Github 名称代替.
这样做的主要目的就是为了以后可以通过该网址进行访问你的博客主页, 所以要仔细设置. 在这里, 我配置成 Ninwoo.github.io
以下的配置中, 也需要对应修改为你自己的仓库名.
安装 Node.js
访问 Node.js https://nodejs.org/en/download/ 官网下载安装包.
下载完成后, 点击安装. 打开 CMD 查看是否安装成功.
- C:\Users\ljo04>node -v
- v8.12.0
- C:\Users\ljo04>npm -v
- 6.4.1
如果上述命令均正常通过, 则安装完成.
安装 Hexo
1. 创建一个新的文件夹作为 Hexo 的开发目录, 这里我命名为 Hexo_project
E:\project>mkdir Hexo_project
2. 使用 npm 安装 Hexo
为了提高安装速度, 先配置淘宝 npm 镜像
E:\project\Hexo_project>npm config set registry https://registry.npm.taobao.org
3. 安装 Hexo
E:\project\Hexo_project>npm install -g hexo-cli
4. 初始化 hexo
- E:\project\Hexo_project>hexo init blog
- INFO Cloning hexo-starter to E:\project\Hexo_project\blog
- Cloning into 'E:\project\Hexo_project\blog'...
- remote: Counting objects: 68, done.
- remote: Total 68 (delta 0), reused 0 (delta 0), pack-reused 67
- Unpacking objects: 100% (68/68), done.
- Submodule 'themes/landscape' (https://github.com/hexojs/hexo-theme-landscape.git) registered for path 'themes/landscape'
- Cloning into 'E:/project/Hexo_project/blog/themes/landscape'...
- remote: Counting objects: 838, done.
- remote: Compressing objects: 100% (6/6), done.
- Receiving objects: 26% (222/838), 292.01 KiB | 88.00 KiB/s
这个过程可能需要等待一阵时间
5. 测试站点是否创建成功
- # 创建一篇博客 test
- E:\project\Hexo_project\blog>hexo n test
- # 生成博客
- E:\project\Hexo_project\blog>hexo g
- # 启动服务器预览
- E:\project\Hexo_project\blog>hexo s
这时, 可以打开浏览器访问 http://localhost:4000/, 查看 blog 界面, 发现已经创建好新的文章 test.
推送至网站
1. 修改 blog 配置文件 E:\project\Hexo_project\blog\_config.yml
- deploy:
- type: git
- repo: git@github.com:Ninwoo/ninwoo.github.io.git
- branch: master
注意: 这里 repo 要选择 ssh 的 git 库链接, 否则会在部署的时候报错
2. 安装 Git 部署插件
E:\project\Hexo_project\blog>npm install hexo-deployer-git --save
3. 部署博客
- E:\project\Hexo_project\blog>hexo clean
- E:\project\Hexo_project\blog>hexo g
- E:\project\Hexo_project\blog>hexo d
4. 测试是否部署成功
现在访问 https://ninwoo.github.io/ , 如果出现 blog 界面这证明部署成功.
更换主题
如果觉得默认主题实在是太丑, 可以更换其他主题 https://hexo.io/themes/ , 下面的教程中, 我选择 Next 主题.
1. 下载主题
E:\project\Hexo_project\blog> git clone https://github.com/theme-next/hexo-theme-next themes/next
2. 打开配置文件 E:\project\Hexo_project\blog\_config.yml 更换主题
- # Extensions
- ## Plugins: https://hexo.io/plugins/
- ## Themes: https://hexo.io/themes/
- theme: next
- plugins: hexo-generate-feed
3. 重新部署 blog
- E:\project\Hexo_project\blog>hexo clean
- E:\project\Hexo_project\blog>hexo g
- E:\project\Hexo_project\blog>hexo d
小节
到这里, 高端大气上档次的 Blog 就创建完成了, 读者可以开始编写自己的 blog 啦!
来源: http://www.bubuko.com/infodetail-2768158.html