【TVer】嫌いな特定の番組を非表示にするCSS。邪魔なのは消そうぜ！
PCウェブサイト版「Tver」を開くとトップページにずらずらと番組タイトルとサムネイルがタイル状で表示されます。
僕は普段利用していないのでまぁいいっちゃいいんですが、たまーに開いた時、嫌いな芸人や俳優が出ている番組、気持ち悪いタイトルなどが目に入って「うげー」ってなってしまいました。
YouTubeには「YouTubeフィルタ」というくっそ便利な拡張機能があるので、もしかしたら「Tver」にもそういうブロック系の拡張機能があるかなと調べてみましたが、記事執筆時点では見つけられませんでした。
https://www.naporitansushi.com/youtube-filter/僕は拡張機能を作成できないので少々読者の皆さんに手間をわずらわせてしまいますが、CSSを使うことで特定の番組を非表示にできます。
他人には全く影響せず、自分のPC環境上だけです。いつでもオンオフできます。拡張機能を導入できるPCブラウザ向けの内容です。スマホやタブレットのアプリ版ではできません。
インストール方法
Chromeウェブストアからインストールできます。
Chrome拡張機能だけでなく「Microsoft Edge」と「Firefox」版もあります。本記事では「Stylebot」を紹介しますが「Stylus」などでもOKです。僕はメインでは「Stylus」を使っています。
https://chrome.google.com/webstore/detail/stylebot/oiaejidbm...「Chromeに追加」をクリックします。
「拡張機能を追加」をクリックします。
拡張機能のオーバーフローメニューに追加されたらOKです。
頻繁に開く場合は拡張機能のオーバーフローメニューを開いて「Stylebot」の隣にあるピン留めアイコンをクリックします。ツールバーに直接配置されます。
詳しい使い方を知りたい方は以下の記事を参考にしてみてください。
Tverから特定の番組を消すCSS
スタイルシートを開く
「TVer」にアクセスします。インストールした「Stylebot」拡張機能アイコンを左クリック→「Stylebotを開く」をクリックします。
右側に白紙のサイドバーが表示されます。
もし初めて「Stylebot」を起動した場合は「ベーシック」という画面が表示されます。下部にある「コード」をクリックすると白紙のスタイルシート画面を開けます。
CSSを書き込む
ベースのCSS
以下の基盤となるベースのCSSを書き込みます。
/*特定の番組非表示*/
[class^="home-page-main"] div[class*="-item_container"]:has(img[alt*="〇〇〇"]) {
display: none !important;
}僕は毎日のように「TVer」を利用しているわけではないので、いつの間にかコードが使えなくなっていても気づかない可能性が高いです。もし使えなくなっていた場合はお手数ですが問い合わせより連絡いただければ幸いです。
下記画像のようになればOKです。当サイトの他のCSS記事はここで「はい終わり」ですが、今回の場合はただ上記のCSSを書き込んだだけだとダメです。皆さんで見たくない番組を指定する作業が必要です。
見たくない番組を指定する
スタイルシートにベースのCSSを書き込んだ状態で、「Tver」上の見たくない番組の名前をコピーします。試しに「アメトーーク！」をコピーしてみます。誤字があったら動作しないので丸々範囲選択してコピーが確実です。
コピーできたらベースのCSSにある「〇〇」の部分を削除してそこに貼り付けます。置き換える作業ですね。
前後にある記号やら文字を間違って削除しないよう注意です。削除しちゃった場合はもう一度ベースのCSSをコピペしてください。
「アメトーーク！」の場合は以下のようになります。
/*特定の番組非表示（アメトーーク！）*/
[class^="home-page-main"] div[class*="-item_container"]:has(img[alt*="アメトーーク！"]) {
display: none !important;
}最初の「特定の番組非表示（アメトーーク！）」はコメントアウト、すなわちCSSには関係しないメモみたいなものなので、大量にCSSを複製して書き込む場合番組名に変えて皆さんが見やすいようにしてOKです。そもそもなくてもOKです。
置き換えられたらスタイルシートの「×」を押して閉じます。
再度拡張機能ボタンを押して、登録したサイト（例：tver.jp）がオンになっていることを確認します。オンになっている間は有効になっているということです。
消えたか確認する
指定した番組がトップページから姿を消します。元々なかったかのように横にある番組が詰めてくれます。
ただランキング系だと上に数字が表示されていて、そこは変えてくれないので、4位を消したら3位のあと5位になります。「あ、ここに消した番組があったんだな」と分かってしまいます。
ベースのCSSは何回でも書き込めます。10個消したい番組があったら10個CSSをコピペしてその分番組名を書き換えます。じゃんじゃん特定の番組を消せます。
一時的に無効化したい場合は、「Stylebot」拡張機能アイコンを左クリック→「tver.jp」をオフにします。完全に使わなくなった場合は、書き込んだコードを削除します。
応用でもあり注意点でもある技
応用でもあり注意点でもある技を紹介します。
「マツコ＆有吉 かりそめ天国」と「マツコの知らない世界」、「千鳥かまいたちアワー」と「いろはに千鳥」と「千鳥のクセスゴ！」…といったように、芸人や俳優などの人名が番組に入っていてそれら全部見たくない場合、番組名ではなく人名を書き込むことで一気に消せます。
例えば「マツコ」が入っている番組を全部見たくない場合は、ベースのCSSの〇〇部分を「マツコ」にします。「マツコ」という文字が含まれている番組が全部非表示になります。
同じように千鳥が見たくない場合は「千鳥」にします。千鳥かまいたちアワー、いろはに千鳥、千鳥のクセスゴ！…全部消えます。
いちいち番組ごとで何個もCSSを書かなくていいので手間が省けるというメリットがありますが、一方でその名前が入っている番組を全て消してしまうので思わぬ事故が発生する可能性があるというデメリットがあります。
例えば芸人の千鳥さんを消したくて書いたのに、芸人とは全く関係ない別の意味で使われていた千鳥が含まれている番組も知らぬうちに消してしまっていた…みたいなパターンです。
芸人さん以外に千鳥って単語が使われる番組があるのかは知りませんが。あくまでそういうパターンがあるっていう一例です。
他にもその人が新しくその名前を含んだ新番組をスタートしていたとしても一気に消してしまいます。
知らぬうちに消してしまっている可能性があり自分が損する可能性があるので、基本的には番組名でいくのがいいのかもしれません。損ってのはCSSオフにした時初めて気づいて、もうその時には過去の見逃し配信が終わっていた…とかね。
「Tver」関連の他記事紹介
他にも「Tver」関連の記事を書いています。気になった方は当サイトのサイト内検索等を活用してみてください。
- 【Tver】お気に入りから視聴済み動画を非表示にするJavaScript
- PC版Tverのライブ動画もピクチャーインピクチャーできる拡張機能
- 【Vivaldi】Tverが再生できない時の対処法。広告ブロックが原因かも？
- 【TVer】サムネイルと動画プレーヤーを角丸にするCSS
- 【TVer】動画マウスホバー時に暗くさせないようにするCSS
2023年11月からお気に入りページの視聴済み動画を非表示にする機能が廃止されましたが、有志の方が作成してくださったスクリプト「Remove watched programs for TVer」を利用することで強制的に視聴済みの動画を非表示にできます。
見逃し配信動画は「Picture-in-Picture Extension」でピクチャーインピクチャーにできますが、現在進行形で配信されているライブ動画はピクチャーインピクチャーにできません。別の拡張機能を利用することでピクチャーインピクチャー化できます。
感想
以上、PCウェブサイト版「TVer」のトップページに表示される気に入らない特定の番組・エピソードを非表示にするCSSでした。
本当は「Tver」公式が標準でそういう機能を実装してくれたらいいんですけどね。CSSだとどうしてもいちいち番組名を指定しないといけないし、コードを書くのもめんどくさいし、サイトの仕様変更によって一瞬で使えなくなるリスクもあります。