Social Stream Ninjaの設定、カスタマイズ、活用方法を学べます
1つのセッションIDですべてがつながります。同じ値を使用してください: ?session= の値を、ドックとオーバーレイのURLで共通にします。
検索するか、カテゴリを1つ開いてください。チャットを画面に表示するだけなら、OBSから始めましょう。
一致するガイドはありません。
Social Stream Ninjaを使うには、まずインストールが必要です。ブラウザー拡張機能は、複数の方法でインストールできます:
インストールの詳しい手順は、次をご覧ください: ダウンロードページ.
インストールしたら、次の手順でSocial Stream Ninjaを使い始めます:
補足: ブラウザー拡張機能を使用する際は、チャットウィンドウを最小化せず、見える状態にしておくと安定して動作します。
Social Stream Ninjaは100以上のプラットフォームに対応しています。主なプラットフォームへの接続方法を紹介します:
URLにパラメーターを追加して、ダッシュボードとオーバーレイの両方をカスタマイズできます。例:
&darkmode - ダッシュボードのダークモードを有効にします&scale=2 - すべての要素の大きさ/解像度を2倍にします&hidesource - プラットフォームのアイコン(YouTube、Twitchなど)を非表示にします&compact - 名前とメッセージの間隔をなくします&inline - 通常の間隔を保ったまま、名前の横にメッセージを流します&autoshow - メッセージが届くと自動で注目表示します(3秒で約2件)
&showtime=20000 - 選択したメッセージを20秒後に自動で非表示にします&showsource - ユーザー名の横にプラットフォームのアイコンを表示します&fade - 注目メッセージを即座に表示せず、フェードインさせます&swipe - 注目メッセージを左からスワイプして表示します¢er - 注目メッセージを画面の中央に配置します
URLを簡単に管理するには、次をお試しください: URLパラメーター編集ツール.
CSSで見た目をカスタマイズする方法はいくつかあります:
OBSでは、ブラウザーソースにカスタムCSSを追加できます:
body { background-color: rgba(0, 0, 0, 0); margin: 0px auto; overflow: hidden; }
:root {
--comment-color: #090;
--comment-bg-color: #DDD;
--comment-border-radius: 10px;
--comment-font-size: 30px;
--author-border-radius: 10px;
--author-bg-color: #FF0000;
--author-avatar-border-color: #FF0000;
--author-font-size: 32px;
--author-color: blue;
--font-family: "Arial", sans-serif;
}
.hl-name {
padding: 2px 10px !important;
}
拡張機能のメニューからCSSを直接追加します:
CSSが組み込まれた、スタイル設定済みのテンプレートから選べます:
YOURSESSIONID をテンプレートURL内で、自分のセッションIDに置き換えます例: https://socialstream.ninja/themes/pretty.html?session=YOURSESSIONID
名前の色には2つの設定が必要です。全般的な色の取得元を次で設定します: メッセージ - スタイル(Message - Styling) と、次にあるドックの表示切り替え: メッセージ - 表示(Message - Visibility).
チャット名の色分けガイドを開く で、スクリーンショット、色の選択、問題の対処法、CSSの例を確認できます。
好みのフォントを次で使えます: dock.html または featured.html Googleフォントやシステムフォントに依存せずに。
@font-face.&css=, &b64css=, &font=、または &googlefont=.自分でホストするフォントのガイドを開く でホスティングの手順とCSSの例を確認できます。
Social Stream Ninjaは、テキスト読み上げ技術でチャットメッセージを声にできます:
&speech=en-US をfeatured.htmlまたはdock.htmlのURLに追加します&pipervoice=pt_BR-faber-medium またはeSpeak &espeakvoice=pt-br、スペイン語ではPiperを使用できます: &pipervoice=es_ES-davefx-medium またはeSpeak &espeakvoice=es.&pitch=1&volume=1&rate=1&ttsprovider=kokoro&ttsprovider=piper&espeakvoice=pt-br とスペイン語 &espeakvoice=es&ttsprovider=kitten&ttsprovider=openai&openaiendpoint=http://localhost:8880/v1/audio/speechローカルでプライバシーを保って使いたいですか? 参照先: ローカルAI読み上げガイド で、自分でホストするサーバーの選択肢やOBSの音声キャプチャを含む、設定手順全体を確認できます。
Social Stream Ninjaでは、AIをいくつかの異なる方法で使用できます。プロバイダーを決める前に、使いたいワークフローを選んでください。
chatgpt.com タブで、APIキーは不要です。オーバーレイでのメッセージの表示方法を整理します:
配信プラットフォームから、新規フォロワー、サブスク、レイド、寄付など、チャット以外のイベントを取得します。
補足: 寄付形式のイベント(Super Chat、Bits、チップ)は、この切り替えに関係なく自動で転送されます。この切り替えは主に、フォロワー/登録者アラート用です。
イベントペイロードとデータフィールドの全一覧については、次を参照してください: イベントリファレンス のドキュメント。
TwitchのHype TrainとTreasure Trainの進行状況を、Twitch風のトップバーとしてOBSに表示します。
初めてチャットする人を強調表示したり、任意の葉のバッジを付けたり、初回だけドックの通知音を鳴らしたりします。
Event Flowエディターは、独自のワークフローを構築できる、ノード形式の自動化システムです。自分でルーティングのロジックを組み立てられる、高度な自動化の機能です。
音声、メディアオーバーレイ、OBSのアクションを動かすには、Flow ActionsページをOBSのブラウザーソースに追加する必要があります:
重要: 現在のRelay Chatアクションは、転送の反射と認識したメッセージを自動でスキップします。次を使用してください: 反射フィルター(Reflection Filter) ノードを使うと、取得されたエコーをドックとオーバーレイに表示するか制御できます。参照: チャットリレーの操作ガイド で設定してください。詳しい説明は次を参照してください: Event Flowガイド。Kickの報酬の音やメディアには、次を使用してください: Kickのチャンネルポイント/報酬ガイド.
Stream Deck、MIDIコントローラー、キーボードのホットキーから、Social Stream Ninjaを直接操作できます。
ヒント: MIDIは、手を使わずに配信を操作するのに適しています。フットペダルでアラートを起動したり、ノブで音量を調整したりできます。
チャット用の双方向Botコマンドや自動応答を作成できます。
!joke - オタク風の親父ギャグをランダムに送信します!hi - 視聴者に自動であいさつします!cycle - 視聴者がOBSシーンを変更できるようにします(許可が必要)より複雑なコマンドには、Event Flowエディターを使用します:
要件: 自動応答はChromium系ブラウザーで最も安定して動作します。チャットウィンドウは見える状態を保ち、そのプラットフォームへの投稿権限が必要です。
外部の寄付プラットフォームを接続し、チップや購入を配信オーバーレイに表示します。
Global settings and tools → Mechanicsで、次を有効にします: 拡張機能のリモートAPI制御(remote API control of extension)&server, &server2、または &server3 を寄付Webhookに使用します正規化された寄付は、チャット、アラート、Event Flow、チップジャー/目標メーターで共有されます。
| プラットフォーム | Webhook URL | イベントの種類 |
|---|---|---|
| Stripe | https://io.socialstream.ninja/{sessionID}/stripe |
checkout.session.completed |
| Ko-Fi | https://io.socialstream.ninja/{sessionID}/kofi |
公開チップ、メンバーシップ、ショップの注文、コミッション |
| Buy Me A Coffee | https://io.socialstream.ninja/{sessionID}/bmac |
チップ、メンバーシップ、ショップの注文、コミッション、ほしい物リストへの支援 |
| Fourthwall | https://io.socialstream.ninja/{sessionID}/fourthwall |
注文、ギフト、寄付、新規サブスク |
https://io.socialstream.ninja/YOUR_SESSION_ID/stripecheckout.session.completedテスト: Stripeのテストモードで次のカードを使用します: 4242 4242 4242 4242、任意の将来の有効期限、任意のCVC。
使用するもの: 図解付き設定ガイド でFourthwall、Ko-fi、Buy Me a Coffeeの設定を確認できます。受信側の状態、独立したプレビュー、商品の取り込みも説明しています。
チャットデータを外部サービスに書き出すこともできます:
ブラウザー拡張機能でよくある問題の解決方法
ブラウザーウィンドウがバックグラウンドにある、または最小化されていると、チャットメッセージが表示されなくなる場合があります。ブラウザーがリソース節約のため、バックグラウンドタブの処理を抑えることが原因です。
chrome://flags/#enable-throttle-display-none-and-visibility-hidden-cross-origin-iframeschrome://flags/#calculate-native-win-occlusionchrome://settings/performanceBotコマンドや自動応答を使おうとすると、青いデバッグバーが表示される、または自動応答が動作しない場合。