banner
NEWS LETTER

Hexo添加看板娘

Scroll down

本文作者:丁辉

Hexo添加看板娘

方法一

  1. 安装 NPM 包

    1
    npm install --save hexo-helper-live2d
  2. 下载模型

    小模型

    大模型

  3. 改名模型目录名为 live2d_models/ 在 Hexo 工作目录下

  4. 编辑配置文件

    1
    vi _config.yml

    内容如下

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    live2d:
    enable: true
    scriptFrom: local # 主目录
    pluginRootPath: live2d_models/ # 模型目录
    pluginJsPath: lib/ # 脚本文件相对与插件根目录路径
    pluginModelPath: assets/ # 模型文件相对与插件根目录路径
    # scriptFrom: jsdelivr # jsdelivr CDN
    # scriptFrom: unpkg # unpkg CDN
    # scriptFrom: https://cdn.jsdelivr.net/npm/live2d-widget@3.x/lib/L2Dwidget.min.js # 你的自定义 url
    tagMode: false # 标签模式, 是否仅替换 live2d tag标签而非插入到所有页面中
    debug: false # 调试, 是否在控制台输出日志
    model:
    use: live2d-widget-model-koharu # 对应的模型名称
    # use: wanko # 博客根目录/live2d_models/ 下的目录名
    # use: ./wives/wanko # 相对于博客根目录的路径
    # use: https://cdn.jsdelivr.net/npm/live2d-widget-model-wanko@1.0.5/assets/wanko.model.json # 你的自定义 url
    display:
    position: left # 居右
    width: 80 # 宽度
    height: 120 # 高度
    mobile:
    show: true # 移动端是否显示
    react:
    opacity: 0.7 # 模型透明度


    live2d:
    enable: true # 是否启动
    scriptFrom: local # 默认
    pluginRootPath: live2dw/ # 插件在站点上的根目录(相对路径)
    pluginJsPath: lib/ # 脚本文件相对与插件根目录路径
    pluginModelPath: assets/ # 模型文件相对与插件根目录路径
    tagMode: false # 标签模式, 是否仅替换 live2d tag标签而非插入到所有页面中
    debug: false # 调试, 是否在控制台输出日志
    model:
    use: live2d-widget ## 模型文件
    display:
    position: right # 定位方向 left right top bottom
    width: 150 # 小人宽度
    height: 300 # 小人高度
    hOffset: -15 # 向👇偏移
    vOffset: -15 # 像👈偏移
    mobile:
    show: true # 手机端是否显示
    react:
    opacity: 0.7 # 模型透明度

    作者:船过水无痕
    链接:https://juejin.cn/post/6925325394820202510
    来源:稀土掘金
    著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。

方法二

Github仓库

<head> 中加入

1
2
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/font-awesome/css/font-awesome.min.css">
<script src="https://cdn.jsdelivr.net/gh/17lai/live2d-widget@latest/autoload.js"></script>

I'm so cute. Please give me money.

其他文章
cover
清理镜像仓库
  • 70/01/01
  • 00:00
  • Kubernetes-镜像仓库
cover
Calico网络插件安装
  • 70/01/01
  • 00:00
  • Kubernetes-部署文档
目录导航 置顶
  1. 1. Hexo添加看板娘
    1. 1.1. 方法一
    2. 1.2. 方法二
请输入关键词进行搜索