OBSでツイキャスのコメントを表示する手順を解説します
※2025年5月に更新しました。
数ある配信サイトの中でも人気なのがツイキャスです。
ツイキャスのライブ配信を見ていると、配信画面の中にコメントを取り込んでいる人を見かけます。
この配信画面の中にコメントを映し出すのは、どのような設定をすればいいのでしょうか。
実はOBSを使っているのなら、簡単に設定ができるのです。
ここではOBSを使ってツイキャスのコメントを、配信画面に表示する手順を解説していきます。
初心者でも簡単にできるので、設定方法を確認してください。
記事監修者 2024年 2月 監修者：ビデオ制作ディレクター / ＭＤＭ合同会社 代表 水田吉紀
2012年 営業職から映像製作会社に転職し、映像カメラマンの業務に携わる。 2020年 ＭＤＭ合同会社を設立。
ライブ配信業務を中心にビデオ撮影・動画編集の仕事を請け負っている。
目次
ツイキャスで配信画面にコメントを表示する方法
ツイキャスで配信画面からコメントを表示するためには、先に確認をしておくことがあります。
そのためにツイキャスにアクセスしてください。
ツール・ゲームズ配信を選択
画面の右上にある配信するというボタンにカーソルを合わせると、ブラウザ配信とツール・ゲームズ配信という項目が出ます。
この2つのうち、ツール・ゲームズ配信をクリックしてください。
ツールとの連携設定をクリック
次に表示されるページのモニターの下にある「ツールとの連携設定」をクリックしましょう。
配信ツール向けオーバーレイのタブを選択
ウインドウが新しく開くので、配信ツール向けオーバーレイというタブをクリックします。
するとコメントを配信画面に表示という項目があり、その下にURLが表示されているはずです。
このURLをコピーしてください。
ここまででツイキャスでのOBS連携準備が完了しますが、初めてツイキャスとOBSを連携する場合は「ツールとの連携設定」の画面はこのままにしておきます。
OBS側の設定準備をしていこう
ではOBS側の設定を解説していきます。
設定 ⇒ 配信 ⇒ 「サービス」から「カスタム」を選択
先ずは設定から配信を開いて、画面上部のサービスからカスタムを選びましょう。
次にサーバーとストリームキーの設定をすることになるのですが、こちらの情報はツイキャスに表示されています。
既に設定している場合は、飛ばしてもらっても大丈夫です。
関連情報：ツイキャス｜配信設定
ツイキャスのストリームキーとRTMP URL
ツイキャスのツール・ゲームズ配信をクリックして、ツールとの連携設定のタブを開いてください。
そこにストリームキーと、RTMPのURLが記載されているのでOBSにコピー＆ペーストし、その後に適用からOKの順で選択します。
OBS側のコメント設定をしよう
OBSのソースパネル
OBSのホーム画面下部にあるソースを確認します。
一度もソースを設定したことがないのなら、ソースがありませんと表示されているはずです。
ソース⇒ブラウザを選択
新規作成で名前を付ける
ここの画面の下にプラスマークがあるのでクリックすると、項目が表示されるのでブラウザを選択してください。
名前をつける画面が出るので、わかりやすいようにツイキャスコメントとしておくのがおすすめです。
ブラウザ（ツイキャスコメント）のプロパティに取得したURLを貼り付け
OKを押すとソースの部分にツイキャスコメントと追加されていますので、ダブルクリックで開いてください。
画面の中頃にURLという設定項目がありますので、ツイキャスにある配信向けオーバーレイにあったURLをコピー＆ペーストをしましょう。
OKを選択すると、OBSの配信画面にコメント欄が表示されるはずです。
ツイキャスの画面を見てコメント欄の表示を変えよう
前段までの解説でツイキャスの画面にコメントが表示されるようになります。
ただデザイン面や表示されるコメント欄の大きさが、気になる人も多いはずです。
そこでOBSでコメント欄の大きさを変える方法を見ていきます。
ブラウザ（ツイキャスコメント）のプロパティに取得したURLを貼り付け
先程配信向けオーバーレイのURLをペーストしたブラウザのプロパティ画面を開いてください。
OBSのソースからブラウザをダブルクリックです。
ペーストしたURLの欄の下に、幅と高さを設定する場所があります。
デフォルトでは幅が800・高さが600になっているでしょう。
このサイズのコメント欄が大きい場合は、自分の都合の良いサイズに変更していくといいでしょう。
変更の方法は数字を変えるだけです。
またOBSのモニターでコメント欄をクリックすることで、サイズや場所を好きに変更することもできます。
実際に確認するのならツイキャスの配信ページを開いて、自分でコメントを入力して確認してみてください。
ツイキャスコメント欄のデザイン変更はどうすればいい？
デフォルトのコメント欄デザインが気に入らないという人もいるでしょう。
その場合は自分でカスタマイズすることができます。
ブラウザ（ツイキャスコメント）のプロパティに取得したURLを貼り付け
先程のソースからブラウザのダブルクリックで詳細を開いてください。
画面中央下にあるカスタムCSSという場所があるので、そちらにCSSをコピー＆ペーストをするだけです。
CSSを自作できる人はそれで良いですし、ネット上にツイキャスコメント用のCSSを公開してくれている方もいます。
またOBSキャスコメ CSSカスタマイザーというツールを使っても良いでしょう。
参考情報：OBSキャスコメ CSSカスタマイザ ー (v0.2)
OBSキャスコメ CSSカスタマイザーについて
OBSキャスコメ CSSカスタマイザー(v0.2)
OBSキャスコメ CSSカスタマイザーは無料で提供されているツールです。
ブラウザでアクセスして、確認の画面を見ながら好きなようにデザインをカスタムできます。
カスタムしたCSSは画面最下部にある「CSSコードをクリップボードにコピー」をクリックします。
後はOBSの「ブラウザのプロパティ」にあるカスタムCSSの項目にペーストすれば反映されるはずです。
OBSでツイキャスのコメントを表示する手順解説 まとめ
OBSを使ってツイキャスのコメントを表示する方法についてまとめました。
ツイキャスのコメントを、配信画面に表示するのは難しくありません。
先にツイキャスにて配信向けオーバーレイのURLをコピーしておき、OBS側でその設定をするだけです。
OBS側ではホーム画面下部にあるソースでブラウザを追加し、ダブルクリックで詳細を表示しましょう。
この詳細画面に先程のURLをペーストすれば完了です。
デザインについてはCSSをカスタムすることで変更できます。
※2022年12月に更新しました。 突然ですがライブ配信をプロに依頼した場合の相場ってどのぐらいかご存じでしょうか？ もちろんイベントの規模や配信事業者によって一概には言えませんが、多くは15～30万円ぐらいが相場の目安となっています。 コロナ過のもと、政府の自粛要請によってあ...
