为博客添加一只可爱的猫猫

今天去逛别人的博客,看到了一只可爱的猫猫,我也想要一只,就去学了一下该怎么弄,参考自这一篇博客:为网站添加live2D。在hexo博客中,操作流程如下:

  1. 安装live2d插件

    1
    npm install --save hexo-helper-live2d

  2. 安装模型

    1
    npm install live2d-widget-model-hijiki

    其他模型:

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    live2d-widget-model-hijiki
    live2d-widget-model-tororo
    live2d-widget-model-chitose
    live2d-widget-model-epsilon2_1
    live2d-widget-model-gf
    live2d-widget-model-haruto
    live2d-widget-model-hibiki
    live2d-widget-model-izumi
    live2d-widget-model-koharu
    live2d-widget-model-miku
    live2d-widget-model-ni-j
    live2d-widget-model-nico
    live2d-widget-model-nietzsche
    live2d-widget-model-nipsilon
    live2d-widget-model-nito
    live2d-widget-model-shizuku
    live2d-widget-model-tsumiki
    live2d-widget-model-unitychan
    live2d-widget-model-wanko
    live2d-widget-model-z16

    其中live2d-widget-model-hijiki是一只黑色的猫猫,而live2d-widget-model-tororo是一只白色的猫猫,其他的就自己尝试吧。

  3. 在hexo的配置文件(即_config.yml)中添加以下内容

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    live2d:
    enable: true
    scriptFrom: local
    pluginRootPath: live2dw/
    pluginJsPath: lib/
    pluginModelPath: assets/
    tagMode: false
    debug: false
    model:
    use: live2d-widget-model-hijiki #这里改为你模型的名字
    display:
    position: right
    width: 180
    height: 300
    mobile:
    show: true
    react:
    opacity: 0.7

最终的效果如右下角所示。(我应该会一直把猫猫留着的吧)


为博客添加一只可爱的猫猫
https://zuoguan.netlify.app/2023/07/30/为博客添加一只可爱的猫猫/
作者
坐观是只皮卡丘
发布于
2023年7月30日
许可协议