対応するものは？
この取り込みツールは、次を対象とします： カスタムチャットウィジェット 。StreamElementsまたはStreamlabs向けに作られたものが対象で、テーマパックのチャット部分も含みます。ウィジェットのソースファイルが必要です。StreamElementsアカウント全体や、オーバーレイURLだけからテーマを取り込む機能ではありません。
次のいずれかを使用します： SSN WindowsデスクトップアプリまたはChrome拡張機能 でチャットを取得します。取り込んだスキンはそのチャットをOBSに表示します。互換性はウィジェットによって異なります。目標、ロイヤルティ、ストア、アラートなどのアカウント機能には手動変換が必要な場合があります。
1. ウィジェットのファイルを入手する
まずデザイナーから提供された元のZIPまたはフォルダーを用意してください。HTML、CSS、JavaScriptと、fields/dataのJSON、画像、フォントを探します。複数のデザインがあるパックでは、1つのチャットウィジェットを選んでください。
インストールリンクしかない場合 デザイナーからチャットウィジェットのソースを入手するか、StreamElementsのカスタムウィジェットエディタにあるコードを使用してください。スクリーンショット、動画、ブラウザソースURLだけでは変換できません。
ウィジェットのコードがStreamElementsエディタ内にある場合
カスタムウィジェットのコードエディタを開きます。利用可能な各部分を、それぞれ別のプレーンテキストファイルとして保存してください： html.txt, css.txt, js.txt, fields.txt および data.txt。書式を追加したりJSONを変更したりせず、そのまま内容をコピーしてください。dataファイルがない場合、取り込みツールはfieldsの初期値を使用します。
次を使い、これらのファイルをまとめて選択します： ファイルを選択（Choose Files）。ローカルの画像やフォントも含めてください。 フォルダーを選択（Choose Folder） はフォルダーのパスを維持します。参照： StreamElementsコードエディタのリファレンス でコードとフィールドの構造を確認してください。
信頼できるコードだけを取り込んでください。ウィジェットのJavaScriptは、プレビューとダウンロードしたオーバーレイで実行されます。
2. 取り込みツールを開く
SSNメニューで、次のセクションの下にある項目を探します： デザイン済みチャットオーバーレイ。探す項目： StreamElements / Streamlabsのチャットスキンを取り込む。現在のセッションが自動入力されます。メニューで次を検索することもできます： StreamElements または 取り込みツールを直接開く.
使う項目： ZIPを選択（Choose ZIP）, ファイルを選択（Choose Files） または フォルダーを選択（Choose Folder）。ファイルの処理が終わるとデモプレビューが表示されます。取り込み時の警告を確認してください。次を使用すると、 詳細なファイル選択（Advanced file selection） 誤ったソースファイルが検出された場合に修正できます。
3. 接続してプレビューする
- SSNを起動したまま、実際のメッセージがチャットドックに表示されることを確認します。
- 取り込みツールの次を確認してください： SSNセッションID / ストリームID（SSN Session ID / Stream ID）。空欄の場合は、次からコピーします： セッションオプション（Session Options） （SSN内）。TwitchやYouTubeのユーザー名ではありません。
- セッションパスワードを使用している場合は入力してください。
- 使う項目： デモプレビュー（Demo Preview） でサンプルメッセージを確認し、その後、 ライブプレビュー（Live Preview） を選び、配信に新しいチャットメッセージを送信します。
- 次の場合： メッセージ履歴（Message history） が表示される場合は、時間経過による削除や最大メッセージ数を調整してください。
Demo Previewはセッションなしで動作し、サンプルメッセージのみを使います。Live PreviewにはSSNから届くチャットが必要です。プレビューが空でも、それだけで接続失敗とは判断できません。
4. ダウンロードしてOBSに追加する
- クリックする項目： OBS用HTMLをダウンロード（Download OBS HTML） を選び、移動しない場所に保存してください。
- OBSで次を追加します： ブラウザソースで、次を有効にします： ローカルファイルを選び、そのHTMLファイルを指定します。
- チャット領域の幅と高さを設定し、もう一度メッセージを送って確認します。
セッションはすでに埋め込まれています。 OBSでのURL編集は不要です。ダウンロードしたファイルをブラウザソースに使用してください。SSNとチャット取得ソースは起動したままにします。取り込みツールとStreamElementsは閉じてもかまいません。
書き出したファイルには、セッションIDと任意のパスワードが含まれます。非公開にしてください。後でセッション、パスワード、ウィジェット設定を変える場合は、元のファイルを再び取り込み、置き換え用ファイルをダウンロードしてからOBSソースを更新してください。
うまく動かない場合
- ウィジェットのコードが見つからない： 元のソースファイルを使用してください。画像、fields/dataだけのファイル、すでに変換済みのSSNファイルは、ウィジェットのソースではありません。
- デモが空白、または見た目がおかしい： Advanced file selectionでHTML/CSS/JSを確認してください。対応するfieldsとdataのファイル、およびすべてのアセットを指定します。
- デモは動くがLive Previewが空白： 新しいメッセージを送り、SSNドックを確認し、セッションIDとパスワードを一致させてください。
- ライブプレビューは動くがOBSが空白： 選択したローカルHTMLファイル、ブラウザソースのサイズと表示状態を確認してから、キャッシュを更新してください。
- フォントや画像が表示されない： 書き出しの概要を確認してください。埋め込めなかったリモートリソースには、アクセス可能なURLとインターネット接続が引き続き必要です。
- メッセージが消える： ウィジェットにMessage history設定があれば調整してください。独自のJavaScriptで削除を制御するウィジェットもあります。
- アカウントAPIやプラグインが動作しない： ウィジェットによってはコードの変更が必要です。取り込みツールの変換用プロンプトを使うか、 サポートを求める 。元のウィジェットファイルと問題のスクリーンショットを添え、セッションの認証情報は共有しないでください。
他の選択肢： 組み込みのチャットスキン, カスタムCSS、または OBSのトラブル対処.