広告を利用しています

当サイトは広告を掲載しています。消費者庁が2023年10月1日から施行した景品表示法の規制対象（通称:ステマ規制）にならないよう配慮して記事を作成しています（記事はこちら、消す方法はこちら）

【U-NEXT】レビュー評価（星）を非表示にするCSS

Stylebot&Stylus(CSS)

「U-NEXT」のアイコン画像

この記事では、PCウェブサイト版「U-NEXT」の各作品に表示されているレビュー評価（星）を非表示にするCSSを書きます。

ウェブサイトに自分で作成したCSSを適用できるChrome拡張機能「Stylebotスタイルボット」や「Stylusスタイラス」を利用します。

【U-NEXT】レビュー評価（星）を非表示にするCSS

ナポリタン寿司はこれまで契約していた動画配信サービス「SPOTV NOW」でプレミアリーグ（欧州サッカー）の配信が終了したので、次に配信してくれる「U-NEXT」のサッカーパックに加入しました。

以前一度だけ1ヶ月無料お試しを利用しただけで、本格的にお世話になるのは実質初めてです。「U-NEXTはこんなUIかぁー」と感心していたところ、作品にマウスホバーした時のポップアップ内に表示される評価（★）が気になりました。

PC版「U-NEXT」の作品にマウスホバーした時に表示される星評価画像

各作品ごとに表示されていて、クリックしていざ映像を見ようとした時にも表示されます。僕は通常のプランには加入しておらず、サッカーパックだけなので、それ以外の作品は見ない（見れない）んですが、気になったのでCSSで非表示にしてみます。

「見たい作品は自分で決める！他人の評価が見えると萎なえてしまう！邪魔！」という方、参考にしてみてください。ただし、CSSを適用できるPCブラウザ専用です。テレビやスマホ、タブレットのアプリ版ではできません。拡張機能を導入できる環境のみです。

自身の環境上で他人には影響しません。迷惑をかける心配はありません。いつでも元に戻せます。

インストール方法

Chromeウェブストアからインストールできます。

Chrome拡張機能だけでなく、「Microsoft Edge」と「Firefox」版もあります。本記事では「Stylebot」を紹介しますが、「Stylus」などでもOKです。僕はメインでは「Stylus」を使っています。

「Chromeに追加」をクリックします。

「Stylebot」拡張機能をインストールする手順画像1

「拡張機能を追加」をクリックします。

「Stylebot」拡張機能をインストールする手順画像2

拡張機能のオーバーフローメニューに追加されたらOKです。

「Stylebot」拡張機能をインストールする手順画像3

頻繁に開く場合は拡張機能のオーバーフローメニューを開いて、「Stylebot」の隣にあるピン留めアイコンをクリックします。ツールバーに直接配置されます。

「Stylebot」拡張機能を直接ツールバーに配置する手順画像

詳しい使い方を知りたい方は以下の記事を参考にしてみてください。

「U-NEXT」の評価を消すCSS

拡張機能を導入したPCブラウザで「U-NEXT」にアクセスします。インストールした「Stylebot」拡張機能アイコンを左クリック→「Stylebotを開く」をクリックします。

「Stylebot」拡張機能のスクリーンショット1

右側に白紙のサイドバーが表示されます。もし初めて「Stylebot」を起動した場合は、「ベーシック」という画面が表示されます。下部にある「コード」をクリックすると白紙のスタイルシート画面を開けます。以下のコードを書き込みます。

/*U-NEXTの星評価を非表示*/
div:has(>div>div>svg>path[d^="M32 50.287L52.57"]) {
    display: none !important;
}
注意事項

本記事のCSSは僕が適当に作成したコードです。皆さんの環境によっては使えなかったり、サイト側の仕様変更でいつの間にか使えなくなる可能性もあります。

もし書き込んでも反映されない場合、問い合わせより教えていただければ幸いです。初心者の僕ができる範囲で修正したいと思います。

下記画像のようになればOKです。記事執筆時点だと「Stylebot」に「has」で子階層（>）という形のCSSを書き込むと赤波線が表示されてエラーっぽい表示になりますが、問題なく動作するので気にしなくてOKです。

右上の「×」でスタイルシートを閉じます。

「Stylebot」拡張機能のスクリーンショット2

再度拡張機能ボタンを押して、登録したサイト（例：video.unext.jp）がオンになっていることを確認します。オンになっている間は有効になっているということです。

ホームの各作品サムネイルにマウスを乗せます。ポップアップで本来なら「★★★★☆」といった感じで評価が表示されていましたが、CSS適用後は表示されません。放送時期（例：2024年）だけ表示されます。

PC版「U-NEXT」のレビュー評価（星）をCSSで非表示にした画像1

作品をクリックした時の詳細ページにも表示されていましたが、同様にCSS適用後は非表示にします。

PC版「U-NEXT」のレビュー評価（星）をCSSで非表示にした画像2

一時的に無効化したい場合は、拡張機能メニュー内にある「Stylebot」アイコンを左クリック→「video.unext.jp」をオフにします。完全に使わなくなった場合は書き込んだコードを削除します。

感想

以上、PCウェブサイト版「U-NEXT」の各作品に表示されているレビュー評価（星）を非表示にするCSSでした。

もし自分が評価する「作品を評価」ボタンを消したい場合は、以下のCSSを追加で書き込みます。

/*U-NEXTの「作品を評価」を非表示*/
button[data-ucn="videoTitleDetail-stage-rate"] {
    display: none !important;
}
PC版「U-NEXT」の「作品を評価」ボタン画像

Stylebot&Stylus(CSS)

Posted by ナポリタン寿司