嘉然live2D|嘉然,我好喜欢你啊,么~
本文最后更新于 1031 天前,其中的信息可能已经有所发展或是发生改变。

前言

我的博客之前因为一些不想说的原因,导致博客数据库损坏,丢失了几乎所有的文章,使我的博客变得空空如也。在我预览某个dalao的博客时,发现了个有意思的东西,于是就跟着他的文章,一步步添加到我的博客上去。

大家可以的话去直接去dalao的博客看原版教程,下面仅仅只是我的总结=a=

邀请嘉然小姐到我的博客

实现初步邀请嘉然小姐,只需要将⬇️下面的代码复制到你主题的<footer>,即可邀请嘉然小姐到你博客的左下角。

<script src="https://cdn.jsdelivr.net/npm/greensock@1.20.2/dist/TweenLite.js"></script>
<script src="https://cubism.live2d.com/sdk-web/cubismcore/live2dcubismcore.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/pixi.js@5.3.6/dist/pixi.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/pixi-live2d-display@0.3.1/dist/cubism4.min.js"></script>
<link href="https://cdn.jsdelivr.net/gh/journey-ad/blog-img@76ba2b3/live2d/lib/pio.css" rel="stylesheet" type="text/css"/>
<script src="https://cdn.jsdelivr.net/gh/journey-ad/blog-img@76ba2b3/live2d/lib/pio.js"></script>
<script src="https://cdn.jsdelivr.net/gh/journey-ad/blog-img@76ba2b3/live2d/lib/pio_sdk4.js"></script>
<script src="https://cdn.jsdelivr.net/gh/journey-ad/blog-img@76ba2b3/live2d/lib/load.js"></script>

当然,如果主题能直接设置页尾脚本,那是最好不过的了(毕竟一般主题更新后设置会保留的,如果直接写主题里边,每次更新都麻烦的要死quq)

加上之后,你会获得一个巨大的大嘉然(太赞了!)

要调整到一个合适的大小,你还需要再在 pio.css 或其它位置为 #pio 添加属性

#pio {
	height: 240px;
    vertical-align: middle
}

这时候你就会得到一个存在于左下角且还带了个菜单栏的嘉然小姐
如果说到这里你就满足了,完全没有问题!

但是嘉然小姐的位置或者其他东西,在我的博客里边还有存在一些不太和谐的地方
所以我想删掉菜单并且让嘉然小姐来到我的右边

对我的博客做适配

删掉右边菜单

在 pio.css 中找个位置添加

.pio-action{
    display:none !important;
}

即可实现

邀请到右侧

在pio.css中,找到.pio-container.left,改成这个样就ok了

.pio-container.left {
    right: 0
}

操作完这些就能获得一个和我一样的嘉然小姐了,摸摸博客的右下角吧~

评论

  1. Dioxide
    Macintosh Chrome
    3 年前
    2022-1-25 18:36:09

    好耶|´・ω・)ノ

  2. Tyou_Yikuyo
    Macintosh Safari
    3 年前
    2022-2-04 3:21:28

    嘉然,我好喜欢你啊,mo~

  3. (◦˙▽˙◦)
    Android Chrome
    3 年前
    2022-2-06 15:38:45

    令人感叹,新年快乐啊朋友[拥抱]

    • 博主
      (◦˙▽˙◦)
      Macintosh Safari
      3 年前
      2022-2-06 20:06:57

      新年同乐ヾ(≧∇≦*)ゝ

  4. Android Chrome
    3 年前
    2022-2-08 1:44:58

    我超,嘉然

  5. Windows Chrome
    2 年前
    2022-6-13 14:43:39

    写的不错哦。谢谢你的标明出处~୧(๑•̀⌄•́๑)૭

发送评论 编辑评论


				
|´・ω・)ノ
ヾ(≧∇≦*)ゝ
(☆ω☆)
(╯‵□′)╯︵┴─┴
 ̄﹃ ̄
(/ω\)
∠( ᐛ 」∠)_
(๑•̀ㅁ•́ฅ)
→_→
୧(๑•̀⌄•́๑)૭
٩(ˊᗜˋ*)و
(ノ°ο°)ノ
(´இ皿இ`)
⌇●﹏●⌇
(ฅ´ω`ฅ)
(╯°A°)╯︵○○○
φ( ̄∇ ̄o)
ヾ(´・ ・`。)ノ"
( ง ᵒ̌皿ᵒ̌)ง⁼³₌₃
(ó﹏ò。)
Σ(っ °Д °;)っ
( ,,´・ω・)ノ"(´っω・`。)
╮(╯▽╰)╭
o(*////▽////*)q
>﹏<
( ๑´•ω•) "(ㆆᴗㆆ)
😂
😀
😅
😊
🙂
🙃
😌
😍
😘
😜
😝
😏
😒
🙄
😳
😡
😔
😫
😱
😭
💩
👻
🙌
🖕
👍
👫
👬
👭
🌚
🌝
🙈
💊
😶
🙏
🍦
🍉
😣
Source: github.com/k4yt3x/flowerhd
颜文字
Emoji
小恐龙
花!
上一篇
下一篇