チャットウィンドウメーカー

OBS での設定

1. ソースを追加 →「ブラウザ」。URL にチャット画面の URL（末尾が /chat）を入れます：
   https://ccfolia.com/rooms/{ルームID}/chat
   ブラウザのアドレス欄にあるルームの URL ではありません。上の「OBS のブラウザソースに入れる URL」からコピーできます。
2. 幅と高さに、上に出ている ブラウザソースの大きさ を入れます。
3. 「カスタム CSS」の中身を全部消して、コピーした CSS を貼り付けます。
4. 何も映らないときや秘匿タブを映すときは、ココフォリアへのログインが必要です。いったん URL を https://ccfolia.com/ にして、ソースを右クリック →「対話」でログインしてから、URL を元に戻します（1 回やれば覚えています）。「対話」ではログインだけして、ルームには入らないでください。
5. メイン以外のタブは、「対話」を開いて窓にマウスを乗せ、出てきたタブから選びます。タブの選択は保存されないので、OBS を起動し直したら選び直してください。

うまく映らないとき

• ルームの背景・スクリーンパネル・駒・拡大縮小のボタンまで映る → チャット画面ではなく、ルームの画面を開いています。ソースのプロパティで、URL の末尾が /chat になっているか確かめてください。「対話」の中でルームに入ってしまったときは、URL をいったん https://ccfolia.com/ にして OK → チャット画面の URL に戻して OK で直ります。
• 何も映らない → ココフォリアへのログインが必要です（上の手順 4）。
• 長い本文の先頭が見えない（日記や手紙など） → 窓に収まらない分は切れます。「メッセージ」タブの並び順を「新しいものを上に」にすると先頭から表示されます（今度は末尾が切れます）。件数を 1 件にし、ブラウザソースの高さを上げて、文字を小さくすると収まりやすくなります。

ダイス用と秘匿チャット用を両方出すとき

• ブラウザソースは OBS の仕様で複製できません（右クリックの「複製を貼り付け」は灰色のままです）。「ソースを追加」→「ブラウザ」で 2 つ目を新しく作り、同じチャット画面の URL を入れて、それぞれにこのツールで作った CSS を貼り付けてください。秘匿チャット用のほうだけ、「対話」で秘匿タブを選びます。
• ログインはすべてのブラウザソースで共通なので、2 つ目で入り直す必要はありません。大きさや位置は、右クリック →「変換をコピー」→ もう一方で「変換を貼り付け」でそろえられます。
• 秘匿タブは、そのタブに参加しているアカウント（GM など）でログインしたときだけ見えます。
• ブラウザソースの設定で「表示されていないときにソースをシャットダウン」「シーンがアクティブになったときにブラウザの表示を更新」をオンにすると、切り替えのたびにタブがメインに戻ります。

台詞（立ち絵つきのメッセージボックス）も映したいとき

• ココフォリアで発言したときにルーム画面の下に出る、立ち絵つきのメッセージボックスは、姉妹ツールのメッセージボックスメーカーで OBS 用にデザインできます。
• メッセージボックスには、ダイスの結果のうち「＞ 成功」のような最後の部分しか出ません。台詞はメッセージボックス、出目まで入ったダイスの結果はこのツール（ひな形「ダイス速報（1件を大きく）」など）と分けて映すのがおすすめです。ブラウザソースは 2 つになりますが、ログインは共通です。

PC に入れたフォントを使うとき

• フォント欄で「名前で指定（PCのフォント）」を選び、フォント名を入れます。Chrome / Edge では「一覧から選ぶ」で、PC に入っているフォントを見た目で選べます（初回はフォントの使用の許可を聞かれます）。
• OBS は自分の PC のフォントで表示するので、OBS を動かす PC にも同じフォントを入れてください。入っていないと、ふつうのゴシック体になります。
• 漢字が入っていないフォントでは、漢字の部分だけふつうのゴシック体になります（一覧の見本の「永」で確かめられます）。

このツールについて

マシュマロでいただいた「ダイスウィンドウや秘匿チャットを、プレビューで確かめながらカスタマイズしたい」という声から作りました。「こんなツールがほしい」「ここが使いにくい」といった声も、マシュマロからお気軽にどうぞ。