惯性聚合 高效追踪和阅读你感兴趣的博客、新闻、科技资讯
阅读原文 在惯性聚合中打开

推荐订阅源

Attack and Defense Labs
Attack and Defense Labs
Cyber Security Advisories - MS-ISAC
Cyber Security Advisories - MS-ISAC
Recent Announcements
Recent Announcements
博客园 - 【当耐特】
博客园 - 三生石上(FineUI控件)
量子位
aimingoo的专栏
aimingoo的专栏
V
V2EX
Vercel News
Vercel News
B
Blog
M
MIT News - Artificial intelligence
OSCHINA 社区最新新闻
OSCHINA 社区最新新闻
The Cloudflare Blog
H
Hackread – Cybersecurity News, Data Breaches, AI and More
cs.AI updates on arXiv.org
cs.AI updates on arXiv.org
Hacker News: Ask HN
Hacker News: Ask HN
TaoSecurity Blog
TaoSecurity Blog
N
News and Events Feed by Topic
D
DataBreaches.Net
Blog — PlanetScale
Blog — PlanetScale
S
Secure Thoughts
U
Unit 42
博客园 - 叶小钗
cs.CV updates on arXiv.org
cs.CV updates on arXiv.org
Hacker News - Newest:
Hacker News - Newest: "LLM"
N
News | PayPal Newsroom
Help Net Security
Help Net Security
S
Security Affairs
Microsoft Security Blog
Microsoft Security Blog
W
WeLiveSecurity
博客园 - Franky
Forbes - Security
Forbes - Security
Microsoft Azure Blog
Microsoft Azure Blog
博客园_首页
Schneier on Security
Schneier on Security
I
InfoQ
B
Blog RSS Feed
大猫的无限游戏
大猫的无限游戏
A
About on SuperTechFans
Webroot Blog
Webroot Blog
AWS News Blog
AWS News Blog
Last Week in AI
Last Week in AI
Security Archives - TechRepublic
Security Archives - TechRepublic
C
CERT Recently Published Vulnerability Notes
N
News and Events Feed by Topic
阮一峰的网络日志
阮一峰的网络日志
L
Lohrmann on Cybersecurity
SecWiki News
SecWiki News
Recent Commits to openclaw:main
Recent Commits to openclaw:main
J
Java Code Geeks

定の栈

macOS Tahoe 如何用自己的视频做动态壁纸(替换 Aerial 方法) Podman Compose 常用命令速查 创建 Swap 文件 Cursor 2025 Hugo 中文阅读时间计算模版 手动重加载不蒜子计数 入坑舞萌 DX 历时两月终抵 w0 与首鸟加 多邻国 600 天连胜 原神五周年纪念 Asuna 成年生日 告别绝区零 站长18周岁啦! 一位动漫迷的追番日志与热情之旅 起飞日志 Reflector 镜像列表更新常用命令与配置文件 个人自用 rsync 文件同步常用命令 历时千日原神,深渊终抵满星 Arch Linux 个人常用命令记录 《三体III:死神永生》 《三体II:黑暗森林》 《千恋*万花》与现代物理学概念奇妙碰撞后产生出的糟糕想法 Minecraft 15 周年骨折价补票入正 记第二次清醒控梦体验 晶蝶终于收集到了x9999上限! 博客成立一周年了! 终于出雾切辣! 让萝莉受孕的糟糕教学 双11剁手铠侠RC20固态体验 Twikoo评论系统备份更改数据 解决Hexo推送时的spawn failed报错 基于 Butterfly 主题的轮播插件美化 原神60级毕业啦! 站长16周岁啦! 本站使用的一些 npm 模块插件 显示器屏幕亮度调节工具推荐 Butterfly主题公告栏插入a标签按钮 关于niconico上兄贵本篇的收集 常用代理设置汇总 HTTP状态码释义 HTML转义字符对照表 HTTP Content-type对照表 部署Meting-API 抽出1命万叶了! 解决打开IE强制跳转Edge浏览器 为你的博客更换鸿蒙字体 无服务器部署Google谷歌镜像 有关科技创新的未来世界的小说。(ChatGPT) 萝莉的审视与经验 提问的智慧 hexo-generator-feed插件中文文档 hexo-filter-nofollow插件中文文档 Butterfly 主题 HTML5 音乐播放器 APlayer 美化调整 ChatGPT注册&使用&调教&镜像整合 Markdown 语法与外置标签写法汇总 突破天翼校园网限制开启移动热点 原神 mod 模组安装教程 WordPress自用插件和主题推荐 Hexo 下 Markdown 语法失效总结 Git常用基本命令使用详细大全 VScode递增减数字或字母插件 《三体I:地球往事》 CDN整理汇总 ASCII 字符画生成 原神胡桃复刻抽卡记录 九亿张涩图收藏 《流浪地球》 原神私服常见问题 原神私服常用指令 原神私服游玩教程整合 安装 ImageMagick 扩展 使 WP 的 URL 链接支持中文 Hello World
网页添加 Live2D 看板娘
Asuna · 2024-04-30 · via 定の栈

引入已有的 Web Live2D CDN 服务,为你的站点加入超超超级 Pro Max Plus +++ 可爱的看板娘

使用

将以下 .css.js 文件链接插入到你的网页中即可调戏可爱的 Live2D 看板娘了!

<link rel="stylesheet" href="https://registry.npmmirror.com/weblive2d/latest/files/waifu.css">
<script async src="https://registry.npmmirror.com/weblive2d/latest/files/js/autoload.js"></script>

进入 NexT 主题的配置文件 _config.next.yml,释放 head 的注释以启动自定义文件配置项

# Define custom file paths.
# Create your custom files in site directory `source/_data` and uncomment needed files below.
custom_file_path:
  #head: source/_data/head.njk
  #header: source/_data/header.njk
  #sidebar: source/_data/sidebar.njk
  #postMeta: source/_data/post-meta.njk
  #postBodyStart: source/_data/post-body-start.njk
  #postBodyEnd: source/_data/post-body-end.njk
  #footer: source/_data/footer.njk
  #bodyEnd: source/_data/body-end.njk
  #variable: source/_data/variables.styl
  #mixin: source/_data/mixins.styl
  #style: source/_data/styles.styl
  head: source/_data/head.njk

新建文件 siteroot/source/_data/head.njk

进入 siteroot/source/_data/head.njk 文件内,将以下代码粘贴进去

<link rel="stylesheet" href="https://registry.npmmirror.com/weblive2d/latest/files/waifu.css">
<script async src="https://registry.npmmirror.com/weblive2d/latest/files/js/autoload.js"></script>

执行 Hexo 二连即可查看效果!

hexo cl; hexo s

进入 Butterfly 主题的配置文件 _config.butterfly.yml,搜索 Insert the code to head 然后参照以下配置更改自己的配置项即可

# Inject
# Insert the code to head (before '</head>' tag) and the bottom (before '</body>' tag)
# 插入代码到头部 </head> 之前 和 底部 </body> 之前
inject:
  head:
    # - <link rel="stylesheet" href="/xxx.css">
    - <link rel="stylesheet" href="https://registry.npmmirror.com/weblive2d/latest/files/waifu.css">

  bottom:
    # - <script src="xxxx"></script>
    - <script async src="https://registry.npmmirror.com/weblive2d/latest/files/js/autoload.js"></script>

执行 Hexo 二连即可查看效果!

hexo cl; hexo s

源码

本文章所用到的 CDN 服务其源码来源于此处…

GitHub:nova1751/live2d-api

版权声明: 本博客所有文章除特别声明外,均采用 CC BY-NC-SA 4.0 许可协议。转载请注明来源 定の栈

赞助

  • 微信

    微信

  • 支付宝

    支付宝


avatar

Asuna

LINK START!

前往主页