绑定域名

xxx.github.io 这种统一标识的域名冗长难记,可以绑定自己的个性化域名。

  1. 购买域名,并且将域名的 @www 子域名以 CNAME 的方式解析到 agedcat.github.io;

  2. 在 Github 仓库中,选择 SettingsPages,在 Custom domain 这里, 输入个性化域名,保存并勾选 enforce https 选项;

  3. 在本地博客文件夹中,./source 目录下,创建一个记事本文件,输入你购买的域名,文件命名为 CNAME,保存类型为所有文件(*.*)

  4. 输入下述命令,将改动的配置同步到 Github:

1
2
3
hexo clean 
hexo g
hexo d

完成后在浏览器中输入个性化域名,验证效果。

自定义主题

默认的 Hexo 博客主题为 landscape,功能简陋,可以根据自己的爱好更换其他主题。

我选择的主题为 Butterfly, 具体过程参见 安装和配置文档

大部分设置可以参见官方文档,部分配置需要自行修改。

永久链接设置

  • 安装插件
1
npm install hexo-abbrlink --save
  • 修改配置文件

将根目录站点配置文件 _config.yml 的对应内容修改为:

1
2
3
4
permalink: posts/:abbrlink.html  # 此处可以自己设置,也可以直接使用 /:abbrlink  posts也可改也可以去掉
abbrlink:
alg: crc32 #算法: crc16(default) and crc32
rep: hex #进制: dec(default) and hex

社交图标设置

Butterfly 虽然支持调用 font-awesome v5 图标,但是 Font Awesome 无论是 v4 还是 v5 支持的图标都很少,所以考虑使用阿里 iconfont 图标库。

  • 进入 阿里 iconfont 图标库 ,注册账号,选择想要的图标将其加入购物车;

  • 点击购物车选项卡,选择添加至项目,同时新建一个项目,转到项目管理页面;

  • 在项目管理页面,选择 Font class 模式,同时点击查看在线链接,之后点击生成代码,获得在线链接;

  • 点击在线链接,得到了一个 CSS 文件,右键另存为到 \themes\butterfly\source\css 文件夹下 font.css 文件;

  • 在 Butterfly 主题配置文件 _config.butterfly.yml 中修改对应配置,以 inject 的方式引入自定义 CSS 文件;

  • Butterfly 主题配置文件 _config.butterfly.yml 中社交图标设置如下所示:

1
2
3
4
5
6
social:
iconfont icon-github: https://github.com/agedcat || Github
iconfont icon-gitee: https://gitee.com/agedcat || Gitee
iconfont icon-youtube: https://www.youtube.com/channel/UCbG3UhFWruKnERPcdYkDRLQ || Youtube
iconfont icon-bilibili: https://space.bilibili.com/49241011 || bilibili
iconfont icon-email: mailto:admin@agedcat.com || Email
  • 如果图标比较小,可以在 font.css 文件中修改对应配置:
1
2
3
4
5
6
7
.iconfont {
font-family: "iconfont" !important;
font-size: 24px;
font-style: normal;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}

备案信息设置

将根目录站点配置文件 _config.yml 的对应内容修改为:

1
2
3
4
5
6
footer:
owner:
enable: true
since: 2022
custom_text: <a href="https://beian.miit.gov.cn/" target="_blank" rel="nofollow">陇ICP备2021000516号-1</a><br /><img src="https://picbed.agedcat.com/config/beian.png"> <a href="https://www.beian.gov.cn/portal/index.do" target="_blank" rel="nofollow" ><i class="police-ico"></i>甘公网安备 62082602000159号</a>
copyright: true # Copyright of theme and framework

背景图优化

参见 Butterfly主题 一图流背景与顶部图修改

参考资料