AI正在绞尽脑汁想思路ING···
BiのAI摘要
HunYuan-Lite

今天感觉网站的字体有些不好看，想换一下，搜索发现网站用woff或者woff2字体，在手机端和电脑都能完美显示

2026年2月3日更新：好像谷歌字体库可以在大陆直连了，速度也很快，所以这篇文章好像没什么必要了。

# 选择字体

首先在网上查找自己喜欢的字体，这里有一个网站

🪧引用站外地址，不保证站点的可用性和安全性
中文开源字体集 Open Source Fonts Collection for Chinese
开源字体

找到一个自己喜欢的，如果有woff或者woff2格式下载下载保存。没有也没关系，转换网站：

🪧引用站外地址，不保证站点的可用性和安全性
转换网站
ttf2woff2

利用这个网站把下载的ttf字体文件转换成woff2格式。

# 添加字体

新建一个css文件

    1
    2
    3
    4
    5
    @font-face {
      font-family: 'CascadiaCodePL';
      font-display: swap;
      src: url('/butterflyChange/fonts/font.woff2') format("woff2");
    }

其中 `font.woff2`改成自己的文件名。
其他字体格式参考

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    @font-face {
       font-family: 'webfont';
       font-display: swap;
       src: url('.eot');  /*IE9*/
       src: url('.eot') format('embedded-opentype'),  /* IE6-IE8 */
            url('.woff2') format('woff2'),
            url('.woff') format('woff'),  /*chrome、firefox */
            url('.ttf') format('truetype'),  /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/
            url('.svg') format('svg');  /* iOS 4.1- */
    }```
    然后在`_config.butterfly.yml`里面引用这个css
    ```yml
    - <link rel="stylesheet" href="/css/font.css">

在主题文件的font配置区域修改字体：

    1
    2
    3
    4
    5
    font:
      global_font_size:  110%
      code_font_size: 100%
      font_family:  # ，全局字体，不带后缀名
      code_font_family: # 这是代码使用的字体

# 参考链接

🪧引用站外地址，不保证站点的可用性和安全性
Ordis的博客
ordis
文章作者: biss
文章链接: https://blog.biss.click/posts/b5601a7e/
版权声明: 本博客所有文章除特别声明外，均采用 CC BY-NC-SA 4.0 许可协议。转载请注明来源 Bi's Blog！
网站
相关推荐
2025-08-12
利用插件自定义页脚菜单
安装安装插件,在博客根目录[Blogroot]下打开终端，运行以下指令： 1npm install hexo-butterfly-footer-marcus --save 如果需要随机友链接的话,再运行以下指令： 1npm i yamljs --save 添加配置信息以下为写法示例 在站点配置文件_config.yml或者主题配置文件_config.butterfly.yml中添加 12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613...
2025-08-12
利用 SiteMap 随机访问站内页面
在网上查找博客美化过程时发现基本上都有“随便逛逛”的功能，于是自己也添加一个。比较简单只有js代码，但是先要安装插件 前置条件1npm install hexo-generator-sitemap --save 在站点配置文件 _config.yaml中添加： 1234567sitemap: path: - sitemap.xml - sitemap.txt rel: false tags: true categories: true 添加js在主题目录下添加·\themes\butterfly\source\js\random.js 12345678910111213function randomPost() { fetch('/sitemap.xml').then(res => res.text()).then(str => (new window.DOMParser()).parseFromString(str, "text/xml")).then(data => {...
2025-08-10
在侧边栏中添加欢迎信息
效果展示 开始折腾申请腾讯地图的api key 🪧引用站外地址，不保证站点的可用性和安全性 腾讯地图 Tencent 自行查看文档,要注意在填写信任域名时不填 https:// 添加js在主题 /source/js/目录下添加 txmap.js 有一个更完善的js脚本 🪧引用站外地址，不保证站点的可用性和安全性 txmap.js github 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858...
2025-08-14
自定义分类条
修改有风险，请注意备份 今天来自定义分类条 添加pug新建文件[BlogRoot]\themes\butterfly\layout\includes\categoryBar.pug文件，写入： 12345678910.category-bar-items#category-bar-items(class=is_home() ? 'home' : '') .category-bar-item(class=is_home() ? 'select' : '', id="category-bar-home") a(href=url_for('/'))= __('博客首页') each item in site.categories.find({ parent: { $exists: false } }).data .category-bar-item(class=select ? (selec...
2025-08-12
博客添加AI总结
之前在wordpress中看到过ai插件，现在使用hexo好像有洪墨AI，但是收费，有点负担不了，于是寻找代替品，真的找到了 🪧引用站外地址，不保证站点的可用性和安全性 liushen开发的插件 ai-summary 首先，安装插件： 1npm install hexo-ai-summary-liushen --save 安装额外插件： 1npm install axios p-limit node-fetch --save 安装后，在Hexo配置文件 _config.yml任意位置添加以下配置： 1234567891011121314151617181920212223242526# hexo-ai-summary-liushen# docs on : https://github.com/willow-god/hexo-ai-summaryaisummary: # 基本控制 enable: true ...
2025-08-14
自定义页脚（新）
添加CSS修改有风险，注意备份 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196...

评论
biss
文章
34
标签
11
分类
5
Follow Me
公告
系列文章
添加网站左上角菜单 2026-02-10
添加typesense搜索 2026-02-05
自定义字体 2026-01-16
在侧边栏添加日历和倒计时 2026-01-16
使用GitHub推送Hexo到服务器 2025-08-18
自定义页脚（新）2025-08-14
自定义分类条 2025-08-14
自定义导航栏 2025-08-13
利用 SiteMap 随机访问站内页面 2025-08-12
博客添加AI总结 2025-08-12
利用插件自定义页脚菜单 2025-08-12
自定义右键菜单 2025-08-11
在侧边栏中添加欢迎信息 2025-08-10
配置说说页面 2025-08-10
最新文章
opencv基础操作 2026-03-15
配置opencv 2026-03-14
自建bitwarden服务 2026-02-25
自建renovate-bot 2026-02-23
新年快乐！2026-02-14
随便逛逛昼夜切换繁简转换阅读模式隐私声明 Cookie协议版权声明