自作アイコンを使用する方法について

対象

わんコメ / テンプレート

利用OS

Windows 10

利用バージョン: Windows、わんコメやOBSのバージョン

Windows: 10
わんコメ: 7.0.1
OBS: 31.0.0

PRO版を利用

していない

過去ログ確認 (検索はこちらから)

した

ドキュメント確認 (公式サイト)

した

内容

以前こちらで質問した者です。
設定を誤って消してしまい、Slimのテンプレートを使用して同じようにアイコンを自作のものに変更しようとしたのですが、うまくいきません。

CSSをSlimのIndex.htmlが入っているフォルダ内のStyle.cssに貼り付け、過去ログでのご指摘通りtemplatseフォルダに自作アイコンをniconama-img.png、twitch-img.pngの名前にして入れましたが、htmlとOBSでの両方でアイコンが白い丸になってしまいます。
画像の場所のURLをC:の部分から指定してみたところ、Index.htmlをブラウザで確認する分には反映されているのですが、OBSで表示させるとアイコンが白丸になってしまいます。

CSSの貼り付け場所が間違っているのか、画像のURLか保存場所が間違っているのか分からなくなってしまったので、再度教えていただきたいです。

[data-service="niconama"] .avatar {
    background-image: url(./niconama-img.png);
    background-size: cover;
    width: var(--lcv-avatar-size);
}

[data-service="twitch"] .avatar {
    background-image: url(./twitch-img.png);
    background-size: cover;
    width: var(--lcv-avatar-size);
}
[data-service="niconama"] .avatar img,
[data-service="twitch"] .avatar img {
    display: none;
}

以前お話しているこのCSSを適用させる場合、カスタマイズしたslimテンプレートと同じフォルダに差し替えたい自作アイコンの画像を置く必要があります。

まずは、画像の置き場所をご確認いただけますでしょうか。

1 Like