重建博客
Hexo Github blog
blog 安装与配置
发布日期:   2021-02-01
作者:   Liloong3t
文章字数:   2.5k
阅读时长:   9 分

简短介绍

倒腾了一两周总算把个人博客网站完善了，目前这个版本使用应该是够了，当然还有一些优化项和功能增加后续在慢慢更新。

本博客基于Hexo框架搭建，用到模板基础为hexo-theme-matery主题,并在此基础之上做了很多修改的洪卫大佬的hexo-blog-fly主题，做了一些个性化修改。洪卫大佬博客地址：https://shw2018.github.io，博客演示：sunhwee.com。

特性

原 matery 主题特性:

  • 简单漂亮，文章内容美观易读

  • Material Design 设计

  • 响应式设计，博客在桌面端、平板、手机等设备上均能很好的展现

  • 首页轮播文章及每天动态切换 Banner 图片

  • 瀑布流式的博客文章列表（文章无特色图片时会有 24 张漂亮的图片代替）

  • 时间轴式的归档页

  • 词云的标签页和雷达图的分类页

  • 丰富的关于我页面（包括关于我、文章统计图、我的项目、我的技能、相册等）

  • 可自定义的数据的友情链接页面

  • 支持文章置顶和文章打赏

  • 支持 MathJax

  • TOC 目录

  • 可设置复制文章内容时追加版权信息

  • 可设置阅读文章时做密码验证

  • Gitalk、Gitment、Valine 和 Disqus 评论模块（推荐使用 Gitalk）

  • 集成了不蒜子统计、谷歌分析（Google Analytics）和文章字数统计等功能

  • 支持在首页的音乐播放和视频播放功能

    增加的工作或特性(未打钩的是已做但还没更新到源码的):

  • 修改了原主题的一些bug 2019.08.05

  • 加入图片懒加载功能，在根目录配置文件开启和关闭 2019.08.09

  • 增加留言板功能 2019.08.05

  • 在关于板块,加入简历功能页 2019.08.05

  • 增加视听[视觉听觉影音]板块 2019.08.10

  • 支持emoji表情，用markdown emoji语法书写直接生成对应的能跳跃的表情。 2019.08.10

  • 增加网站运行时间显示 2019.08.10

  • 增加动漫模型 2019.08.10

  • 整体替换Banner图片和文章特色图片 2019.08.10

  • 增加分类相册功能 2019.08.29

  • 去掉标签页,将其合并至分类页中 2019.09.01

  • 修改了一些控件的参数 2019.09.01

  • 修改部分样式,比如: 文章卡片,固定高度,使其不至于因为文章摘要的长短不同导致卡片大小不一使页面布局很不美观,类似的还有友链卡片,优化了页面内容布局,视觉更整齐美观 2019.09.01

  • 解决首页文章列表卡片上方 border-radius圆角失效的bug 2019.09.01

  • 添加页面樱花飘落动效 2019.09.09

  • 添加鼠标点击烟花爆炸动效 2019.09.09

  • 加入天气接口控件 2019.09.09

  • 加入鼠标点击文字特效 2019.09.10

  • 添加页面雪花飘落动效 2019.09.10

  • 添加在线聊天插件 2019.09.12

  • 持续更新…

简单使用方法：

  1. star 本项目

  2. 安装Git, 安装nodeJS

  3. 你可以直接fork一份源码到你的仓库，clone到本地

  4. 在本地博客仓库运行npm i命令安装依赖包

  5. 修改配置信息，改成自己的信息

  6. 运行命令hexo clean（清除生成文件），hexo g（生成网页）， hexo s（本地预览），hexo d（部署）

博客模板源文件使用方法详解

这两天为了解决协会博客的奇葩问题和重建自己的博客真是查了不少资料，恶补了一波git，算是基本弄清楚了git的简单使用原理以及hexo这种博客模板的基本结构和工作原理（当然也只是会用不会写，刚刚试图魔改就失败了，害）。

hexo博客目录结构

- node_modules        //node.js库文件按
- public        //hexo d 发布的目录
- scaffolds        //hexo 模板文件
- source        //网站源码
    - _data
    - _posts
    - about
    - archives
    - categories
    - friends
    - tags
- themes        //主题源码

而一个现成的博客模板的核心文件只有五个

scaffolds
source
themes
_config.yml
package.json

除了这五个，其它的文件都是附加产品

把一个博客模板clone到本地仓库后，只有这五个文件是必须的，其它的都可以删了，然后使用

npm install hexo    //安装hexo框架
npm install        //安装必要插件
npm install hexo-deployer-git        //安装hexo的deployer插件

如果clone下来的源码有node_modules，package-lock.json，db.json文件的话，则只要使用npm install命令即可，如果有问题的话，就把其它的东西删掉，留下五个核心文件，再跑一遍上面三个命令就行

如果是第一次搭建博客的话，这里有一个关键技巧，以上操作切换到hexo分支上进行，然后保证_config.yml文件中的deploy参数中的branch（分支）参数为master。

git checkout -b hexo        //新建并切换到hexo分支

这样就可以使得hexo d上传的分支为master分支，而源码push的分支为hexo。我们就可以实现在一个仓库中通过两个不同分支同时保存网站和源码（记得把github pages调到master分支上，2020年以后github的默认分支变成了main分支）

每次在提交博客前，先使用“git”三连上传源码备份

git add.
git commit -m "message"
git push origin hexo        //切记这里是hexo分支

养成好习惯

然后再用hexo g -d命令提交博客

这里还有一个小技巧，万一哪天太久没写博客或者脑抽忘了在push后面加上 origin hexo，那可就麻烦大了，虽然有补救措施，但我们应该避免这种麻烦

这时可以使用

git branch --set-upstream-to=origin/hexo hexo

这条命令指定hexo分支的默认远程上传仓库为hexo，这样hexo 默认git push的就是 hexo分支，大大降低手残操作带来的麻烦的可能性。

在一个电脑上使用两个ssh的方法

有时候我们会遇到这种情况，手上有两个git账号要管理，一个私人的一个公有的（或者干脆就有两个私人的），但使用ssh远程连接时会遇到问题。

一个ssh密钥只能连接一个账户或者仓库，这使我们管理两个账户时非常不方便，一个用了ssh以后另外一个就不能用了

这时的解决方法是利用config文件再创建一个ssh密钥并指定主机别名来连接远程git账户（无论是github还是别的git服务器都可以）

用git bash或者命令行打开系统盘“用户”目录下的.ssh文件

ssh-keygen -t rsa -C "这里输入邮箱，其实输啥都行"        //创建新ssh密钥
Generating public/private rsa key pair.
Enter file in which to save the key (/Users/Apple/.ssh/id_rsa): [输入密钥文件名，直接回车就是括号中的默认名称]      //创建第二个ssh密钥不能使用默认的了，我为协会博客创建了一个id_rsa_ais,这个名字可以随便取        

/Users/xxx/.ssh/id_rsa_ais
Enter passphrase (empty for no passphrase):         //添加密码，建议直接回车，使用ssh就是为了省事和安全，再加个密码多此一举了
Enter same passphrase again: 
Your identification has been saved in /Users/Apple/.ssh/id_rsa_ais.    //私钥
Your public key has been saved in /Users/Apple/.ssh/id_rsa_ais.pub. //公钥
The key fingerprint is:
SHA256:1gepuxDHwJRnFbKvc0Zq/NGrFGE9kEXS06jxatPPrSQ xxx@xxx.com //你刚刚输入的邮箱
The key's randomart image is:
+---[RSA 2048]----+
|      ....=*oo   |
|     o. ooo=+ .  |
|      oo. =+o.   |
|       o =.o..   |
|      . S =o.    |
|       = =++.    |
|      . B.=.Eo.. |
|       o B . +o .|
|          . o.. .. |
+----[SHA256]-----+

自己把ssh公钥上传到远程git服务器上去

然后打开.ssh文件中的config文件（没有就自己创建一个）

添加如下代码

#Default GitHub
  Host github.com        //主机名称
  HostName github.com    //主机
  User git
  IdentityFile ~/.ssh/id_rsa    //密钥文件

  Host github-wustais    //同上，这里相当于为github.com起了个别名，使用这个别名的时候用的密钥文件就会是id_rsa_ais
  HostName github.com
  User git
  IdentityFile ~/.ssh/id_rsa_ais    //这里你刚刚创建的密钥文件叫什么就改成什么

然后

将GitHub SSH仓库地址中的git@github.com替换成新建的Host别名。

//修改之前
$ git remote -v
github  git@github.com:xxx/xxx.git (fetch)
github  git@github.com:xxx/xxx.git (push)
//这里如果你是使用https方式clone的仓库的话，显示的是https://github.com/xxx/xxx.git,对后续操作没什么影响

//修改 remote set-url
$ git remote set-url github  github-wustais:xxx/xxx.git

验证

//使用修改后的github-wustais SSH连接，连接成功用户是协会账户，此时公钥是id_rsa_ais

$ ssh -T github-wustais    //这里写成git@github-wustais也行
Hi xxx! You've successfully authenticated, but GitHub does not provide shell access.    //这就是成功了，后面这句话是告诉你你没有远程操作控制台的许可，因为用了命令中用了-T参数

//使用默认的git@github.com SSH去连接,连接成功用户是我的私有账户，此时公钥是id_rsa
$ ssh -T git@github.com
Hi xxx! You've successfully authenticated, but GitHub does not provide shell access.

修改之后,需要切换成对应的ssh

有如下两种解决方法：

打开.git/config文件

更改[remote "origin"]项中的url  
对应上面配置的host[remote "origin"] url = git@github-wustais:xxx/xxxx.git    //这里不要git@也行

或者在Git Bash中修改remote 

$ git remote rm origin
$ git remote add origin git@github-wustais:xxx/xxxx.git        //这里不要git@也行

验证

$ git remote -v
github  github-wustais:xxx/xxx.git (fetch)
github  github-wustais:xxx/xxx.git (push)

这时，使用的ssh就会根据.ssh/onfig文件更改为 id-rsa-ais

便可以连接上远程仓库github-wustais:xxx/xxx.git，即git@github.com:xxx/xxx.git了。

  转载请注明: Liloong3t's Blog 重建博客

  目录