style.cssの中のcommon.cssと、theworld.cssの格納先について

対象

テンプレート

対象となるサービス

ツイキャス

内容

わんこめの右から左へ流れるコメビューの背景に画像を設定したいと考えているのですが、
style.cssの中にcommon.cssと、theworld.cssがインポートされているようで、
CSSファイルを変更したい場合どこに格納されておりますでしょうか。

【style.cssの中に記載されているソース】
@import url(‘…/__origin/css/common.css’);
@import url(‘…/__origin/css/theme/theworld.css’);

こんにちわん!

記載の通りthe-worldのstyle.cssの1階層上のフォルダに__originというフォルダがあり、その中のCSSフォルダにcommon.cssとthemeフォルダがあります

@import url(‘…/__origin/css/common.css’);
@import url(‘…/__origin/css/theme/theworld.css’);

ただし、__originフォルダはわんコメ側で自動的に上書きされますので、カスタマイズの際はthe-worldのフォルダを複製し、style.css内にスタイルを上書きするようなCSSを記載するようお願い致します

なおPRO版のテンプレートに関してはすべて再配布等ができませんのでご注意頂ければと思います

よろしくお願いいたします

2 Likes

ASTIE様

お世話になります。ご親切にありがとうございます。
thewordというコメビューのコメントの背景を画像に変更したく思っております。
カスタマイズする際は皆様どのようにされているのでしょうか?
一旦、__origin内もダウンロードして確認なのでしょうか。
大変お手数ですが、ご教授いただけますと幸いです。
ソースのみですとコメビューの背景も確認で来ませんので、
お聞きしてしましました。
何卒よろしくお願いいたします。

度々、失礼いたします。
動作確認をする場合はどのようにすれば良いでしょうか。
OBSとかで設置してからの確認になりますでしょうか。
スタイルシートのみの確認などできる場所はございますでしょうか。
何度も申し訳ありません。
ご教授いただけますと幸いです。

カスタマイズの手順ややり方については過去に配信で解説しておりますので、こちらを参考にしてください

わんコメには動作確認のためのWebサーバーを内蔵しており、わんコメのテンプレートブラウザで開いて修正をコメントテスターで確認というのが標準の方法となっております

よろしくお願い致します

2 Likes

動画を確認いたしました。ありがとうございました。

「the-world」のテンプレートのコメントビュアーの背景を画像に変更しようと
思っているのですが、「the-world」 のテンプレートがブラウザで正常に表示できませんでした。
これは私の操作方法がやはり悪いでしょうか。
何度も申し訳ございません。ご教授いただけますと幸いです。

動画を確認いたしました。ありがとうございました。

「the-world」のテンプレートのコメントビュアーの背景を画像に変更しようと
思っているのですが、「the-world」 のテンプレートがブラウザで正常に表示できませんでした。
これは私の操作方法がやはり悪いでしょうか。
何度も申し訳ございません。ご教授いただけますと幸いです。

the-worldテンプレートをベースにしたいのであれば、PRO版専用のテンプレートとフリー・PRO共通のテンプレートがあることを先に理解いただく必要があります。

the-worldというのはPRO版を使っている方に向けたテンプレートであり、フリー版ではカスタマイズ前だろうと正常に動かないのが正しい動作です。
テンプレートとしてthe-worldをベースに作ろうと思っていらっしゃるのであれば、まずはPRO版を使える環境にするため、FANBOXでわん500以上のPRO版のライセンスキーがついているプランでの支援をご検討ください。

PRO版の導入が終わりましたら、もともとthe-worldのテンプレートが入っていたtemplates/__proフォルダ内で動画にあったような作業を進めていく必要があります。
現在利用されているtemplatesフォルダはフリー版のテンプレートの挙動になるところのため、PRO版導入いただいても入れる場所を間違えていれば、正しく動作しないままです。

無料で使い続けたいとお考えであるならば、the-worldのテンプレートなどPRO版専用のテンプレートは諦めていただき、フリーでも共通で使えるテンプレートでお気に入りのものをカスタマイズしていくのも一つの手です。

2 Likes

ご親切にありがとうございました。
proにて対応できました。
この度は、助けていただきまして感謝いたします。
今後とも何卒よろしくお願いいたします。