対象: わんコメ
表示画面: OBS Studio 27.2.4
利用OS: MacOS
利用バージョン: わんコメ 3.1.1
過去ログ: 検索した
内容:
テンプレートジェネレーターで作った二つのスタイルを配信サイトごとに使い分けたいですが、可能でしょうか。
以下の内容を参考してススタイルを変えようと思いましたが、
OBSに貼り付けたCSSは以下となります：
[data-service='youtube'] {
/* テンプレカスタム ここから */
@font-face {
（省略）
}
/* テンプレカスタム ここまで */
}
[data-service="twitch"] {
/* テンプレカスタム ここから */
@font-face {
（省略）
}
/* テンプレカスタム ここまで */
}
このようなCSSは可能でしょうか。
可能であれば透過背景でYouTubeは白黒のコメントで、Twitchは紫の方のコメントスタイルを適用したいですが……厳しいでしょうか。
イメージ画像：
お忙しいところ申し訳ございません。
ご教授いただけると幸いです。
何卒よろしくお願いいたします。
nuko
2
フォーラムに同じ内容があったのですが
こちらで問題ないでしょうか？
「いいね！」 1
ありがとうございます。
こちらはすでに確認してました。
ただこちらは、「コメント表示欄をそれぞれが離れた位置に配置したい」という内容で、自分は同じ位置に配置し、YouTubeとTwitchのコメントを分かりやすく分けたいと思います。
テンプレートで配信サイトごとにスタイルを適用する方法
こちらを単体でCSSに貼り付けるのは成功できましたが、同じ要領でジェネレーターと一緒に貼り付けるとダメになってしまいます……
イメージ例：（同じソースで）
YouTubeテンプレート1：こんにちはー！
Twitchテンプレート2：Hello
YouTubeテンプレート1：こんばんは
Twitchテンプレート2：Hello
YouTubeテンプレート1：こんばんは
YouTubeテンプレート1：こんばんは
ジェネレーターと[data-service=‘youtube’]を一緒にCSSに貼り付けるのは無効になるのでしょうか。
お手数ですがご教授いただけると助かります。
azoazo
4
テンプレートによっては無理かもしれませんが、私はline-rightテンプレートに以下のカスタムCSSで配信サイトごとに区別できています。
[data-service=“youtube”] {
background-color: rgba(255,0,0,0.5);
padding: 0 0 0 40px;
background-image: url(“skins_02_youtube_(2).png”);
background-repeat: no-repeat;
background-position: 0 5px;
}
[data-service=“twitch”] {
background-color: rgba(120,0,255,0.5);
padding: 0 0 0 40px;
background-image: url(“skins_03_twitch_(2).png”);
background-repeat: no-repeat;
background-position: 0 5px;
}
[data-service=“niconama”] {
background-color: rgba(0,0,0,0.5);
padding: 0 0 0 40px;
background-image: url(“skins_01_nico_(2).png”);
background-repeat: no-repeat;
background-position: 0 5px;
}
「いいね！」 2
nuko
5
テンプレートによりますが
このようなCSSを書いてこちらになりましたがこれで大丈夫でしょうか？
[data-service=‘youtube’] {
–lcv-text-color: rgb(0, 0, 0);
–lcv-name-color: rgb(0, 0, 0);
}
[data-service=“twicas”] {
--lcv-text-color: rgb(187, 13, 240);
--lcv-name-color: rgb(187, 13, 240);
}
「いいね！」 2
azoazo様へ
非常に見やすくて助かりました！
どうもありがとうございます！！
nuko様へ
返事して下ってありがとうございます。
ジェネレーターのテンプレと合わせてカスタムCSSに貼ってみましたが、やはり出来ませんでした…
テンプレートによるかもしれません…
ご丁寧にありがとうございます！
「いいね！」 1
