SHOWROOMの視聴中の「アバター」を消す/非表示について解説！

動画の視聴中・配信中に表示されて消すことが出来ないSHOWROOMのアバターを消す方法をご存知でしょうか？SHOWROOMの目障りなアバターを配信中の画面から消す方法を紹介します。

SHOWROOMは配信中の画面に視聴中の視聴者のアバターが表示されて目障りです。このユーザーアバターを配信中の画面から見えなくする方法を紹介します。

SHOWROOMは配信者と視聴者で成り立っているコンテンツです。また、本記事で紹介する方法では自分の見ている画面のみからアバターが見えなくなるだけなのでSHOWROOM側に影響はありません。

本記事で紹介する内容を行うと、ルーム内のコメントやギフト効果も見えなくなってしまう可能性があります。

SHOWROOMの視聴中の「アバター」をSHOWROOMのソースコードを編集して消す/非表示にする方法を紹介します。ソースコードの編集はPC版のみ行なえます。スマホではできないので注意してください。

SHOWROOMはhtml5と呼ばれる言語で出来ています。詳しいことは省略しますがhtml5で出来ているSHOWROOMのソースコードを弄ることでアバターを消すことが出来ます。ただし恒久的なものではなく更新やルームの外にでると元に戻ります。

また、アバターだけでなくコメントなどの要素もまとめて見えないようにするので注意してください。作業してうまく行かない場合は一度ルームを抜けて入り直すか、更新を行ってください。作業前の状態に戻ります。

Google ChromeでPC版SHOWROOMへアクセスします。他のブラウザでも構いませんがソースコードをいじりやすいのでChromeがおすすめです。

配信中ルームでF12キー押します。すると上記のような画面が表示されるのでメニューからElementタブを選択してください。

Ctrlキー＋Fキーを同時押しします。

検索欄に「canvas」を入力します。

ソースコード内のcanvas部が黄色くなるので、その部分を右クリックします。

表示メニューのDelete elementをクリックします。これでアバターは消えます。

再度F12キーを押すとソースコードのエディタは消えます。

この方法ではSHOWROOM側には影響はありません。SHOWROOMは配信時にアバターが見える状態のWebページをユーザーのブラウザに送信しています。今回の方法では自身のブラウザに送信されたHTMLファイル編集しているだけです。

Stylishを利用してSHOWROOMの視聴中の「アバター」を消す/非表示にする方法を紹介します。

Stylish操作の手順を紹介します。この方法はアバターを消すのではなく下に下げる操作になります。

スタイルシート作成を行います。まずはアプリストアからStylishを入手してください。

Google ChromeでPC版SHOWROOMへアクセスします。スマホではできないので注意が必要です。スマホでChromeを使ってもできないのでPCで行いましょう。

色が入ったStylishアイコンをクリックします。

縦3つのメニューアイコンをクリックします。

スタイルを作るをクリックします。

セレクションコード1欄に実際のCSSのコードを入力します。下記のコードを入力してください。

最後に保存をクリックして保存します。

再編集手順を紹介します。

Stylishアイコンをクリックします。

インストールされたスタイルから鉛筆アイコンクリックして編集画面を表示させます。

上級者向け操作設定を紹介します。ボックス等が見えなくなる可能性や重要な情報を見逃すこともあるので注意が必要です。

各要素のz-index値(規定値)を作成します。各値は下記のとおりです。

• テロップ：1
• ユーザーアバター：5
• ギフト効果：5
• ギフトエリア（ギフティングボックス）：10
• アラートダイアログ：300
• ボーナスゲット表示：1000

スタイルシートのCSSコードは下記のようにしてください。

Import用Mozilla Formatコードは下記のようにしてください。

SHOWROOM視聴中の「アバター」を消す/非表示の注意点です。

スマホからは仕様が異なるので操作ができないので注意が必要です。

アカウント停止や公式側の仕様変更でバグる可能性があるので自己責任で行ってください。

各メーカーPCで有効という保証はないのでこちらも自己責任で行ってください。