↓2022年12月18日更新
DiscordのアップデートでCSSが変更されたので、概要欄のCSSも更新しました。動画と文字が少し違いますが手順は同じです。
--
もし動かなかったり質問などあればコメントを入れてください。そして使ってみて動いたという報告もコメントしてくれたら他の見ている方も助かるので、使ってみた方はコメントよろしくお願いします!!!
--
【2022.4.3公開…アレンジぴょんぴょんCSS公開しました▶ • 【追加カスタムCSS公開】DiscordとO... 】
--
今回紹介した方法は一番シンプルな導入方法です。
①Discordを起動してからこのサイトに行きます。
[Discord Streamkit Overlay]
/ discord
画面中央にあるOBSの枠の「Discordに接続」を選択して連携させます。
あとは動画の通りです。
②カスタムCSS
以下の部分をコピーして、メモ帳に貼り付けて使用してください。
※KZitemの仕様が変わって、CSSに注釈部分(/* */で囲んだ部分)が入れれなくなりました。
/* */部分を消して掲載しています。(2022-08-20)
●●●● ←[ Discord ID 入れる ]
■■■■ ←(画像1・口閉じ)
◆◆◆◆ ←(画像2・口開け)
----------------------------------------------------------------------------------------------
img:not([src*="●●●●"]){ display:none; }
img[class*="avatar"]{
content:url(■■■■);
height:auto !important;
width:auto !important;
border-radius:0% !important;
}
img[class*="Speaking"]{
border-color:rgba(0,0,0,0) !important;
position:relative;
animation-name: speak;
animation-duration: 1000ms;
animation-fill-mode:forwards;
filter: brightness(100%) ;
}
@keyframes speak {
0% {bottom:0px;
content: url(■■■■);}
30% {bottom:10px;
content:url(◆◆◆◆);}
100% {bottom:0px;}
}
body { background-color: rgba(0, 0, 0, 0); margin: 0px auto; overflow: hidden; }
----------------------------------------------------------------------------------------------
川犬 様 @reverinu_vtuber のツイートを参考に変更をして動作確認をしました。
/ 1603941218106617856
他のCSSも変更を書いてくださっています。
----------------------------------------------------------------------------------------------
-- おまけ -- こちらも 2022年12月18日 更新しました。
▼この頃気に入ってる、Discordアイコンを四角にして横並びにしてぴょこぴょこする方法
enshrined-cloche-996.notion.s...
DiscordアイコンをOBSに読み込む方法は同じで、CSSをこちらに変えるだけでOK!
----------------------------------------------------------------------------------------------
-- おまけ情報 --
▼ジェネレーター見つけました!こちらでいけたら早いです。
OBSのDiscord通話相手立ち絵表示ジェネレーター
obs-discord-picture.alfebelow...
----------------------------------------------------------------------------------------------
▼チャンネル登録
/ @oftunlabo
▼Twitter(配信告知とかつぶやきます)
/ oftunlab
#Vtuber #OBS #Discord #口パク #イラスト #カスタムCSS #コラボ用 #オフトゥン研究所
----------------------------------------------------------------------------------------------
チャンネル登録、通知ON、高評価、Twitterフォローなど、応援よろしくお願いします☆彡
Негізгі бет 【コラボなどに】Discordと連携させてイラストを口パクさせる方法※2023-12-29追記
Пікірлер: 68