【Twitter】トピックを一括で非表示にする方法(CSS)

2022年10月6日Twitter

Twitterのアイコン

この記事では、Twitterのタイムラインに表示される「トピック」ツイートを、「最新ツイート表示」にしなくても非表示にする方法を書きます。

ウェブサイトに自分で作成したCSSを適用できるChrome拡張機能「Stylebot」を使うか、広告ブロッカーの「uBlock Origin」を利用します。

【Twitter】トピックを一括で非表示にする方法(CSS)

本記事で紹介するCSS、あるいは広告ブロッカーのコードを使うことで、Twitterのトピックツイートを全部非表示にできます。

通常、Twitterのタイムライン表示を、「ホーム」にしていると、ちょくちょくトピックツイートが表示されます。「食べ物」、「恋愛」といったジャンル名がツイートの上に表示されて、そのジャンルで注目を集めている方が表示されます。

Twitterのトピックツイート画像

その人をフォローしている・していないは関係なく、表示されます。「さらに表示」を押すことで、その界隈ツイートを一覧表示できます。人によっては、邪魔と思うかもしれません。

トピック横の「×」を押すことで、そのジャンルを非表示にできますが、1つずつ設定するのはめんどくさいです。

インターネットで調べてみると、タイムライン右上にあるキラキラボタンをクリック→「最新ツイート表示に切り替える」をクリックすると、表示されなくなるとありました。確かにその通りでした。

Twitterのタイムライン表示の切り替え画像

Twitter標準の機能なので、上記の方法が、一番手っ取り早くおすすめです。

本記事では、あえて「ホーム」タイムラインのまま、トピックツイートだけを除去する方法について書きます。こだわりがない方は、普通に「最新ツイート表示」に切り替えてください。

インストール方法

ウェブサイトに、自分で作成したCSSを適用できるChrome拡張機能「Stylebot」を利用します。

Chromeウェブストアからインストールできます。Chrome拡張機能だけでなく、Microsoft EdgeFirefox版もあります。

広告ブロッカー「uBlock Origin」を使いたい場合

uBlock Originを使いたい場合は、以下のChromeウェブストアからインストールできます。

ただし、広告ブロッカーは、Twitterだけでなく、ウェブサイト全体に影響します。今回の方法のためだけに導入するのはおすすめしません。

「Chromeに追加」をクリックしてインストールします。

Stylebot - Chrome ウェブストア

右上に拡張機能ボタンが追加されればOKです。詳しく使い方を知りたい方は、以下の記事を参考にしてみてください。

Twitterのトピックを「ホーム」のまま、非表示にする手順

Stylebot(CSS)を使った方法

Twitterにアクセスします。右上の拡張機能アイコン→「Stylebotを開く」をクリックします。

Stylebotのスクリーンショット1

右側に白紙のサイドバーが表示されます。こちらにコードを書き込んでいきます。書き込むコードは、以下になっています。

/*トピックツイート非表示*/
div[data-testid="cellInnerDiv"]:has([href*="/topics"]):has([aria-label*="トピック"]) {
  display: none;
}

下記画像のようになればOKです。右上の「×」でスタイルシートを閉じます。

Stylebotのスクリーンショット2

再度拡張機能ボタンを押して、登録したサイト(例:twitter.com)がオンになっていることを確認します。オンになっている間は有効になっているということです。

これで、Twitterのタイムラインを確認してみます。「最新ツイート表示」に切り替えなくても、トピックツイートが全部非表示になります。「〇〇さんがいいねしました」、「〇〇さんがフォローしています」などのツイートは、そのまま表示します。

Twitterのトピックツイートを「ホーム」のまま、一括非表示した画像

一時的に無効化したい場合は、Stylebot→「twitter.com」をオフにします。完全に使わなくなった場合は、書き込んだコードを削除します。

uBlock Origin(広告ブロッカー)を使った方法

Twitterにアクセスします。右上のuBlock Originアイコンをクリックします。電源マークが青色=有効になっていることを確認して、右下の歯車アイコンをクリックします。

uBlock Originを使って、トピックツイートを削除する手順画像1

新しいタブで設定画面が開くので、上部にある「マイフィルター」タブをクリックします。書き込むコードは、以下になっています。

!【Twitter】タイムラインのトピック非表示
twitter.com##div[data-testid="cellInnerDiv"]:has([href*="/topics"]):has-text(さらに表示)

書き込んだら、上部の「変更を適用」をクリックします。

uBlock Originを使って、トピックツイートを削除する手順画像2

Twitterに戻って、ページをリロードします。これで反映されるはずです。やっぱり元に戻したい時は、書き込んだコードを削除します。

合わせて読みたい

Twitterの誰かがリツイートしたツイートを、全部非表示にする方法も書いています。極限まで、クリーンなタイムラインにしたい方は、参考にしてみてください。

感想

以上、Twitterのトピックツイートを全部削除して、クリーンなタイムラインにする方法でした。

ふと思ったんですが、最近uBlock Originや、CSS関連の記事ばかりですね。ここらへんは、ちょっと折り合いが難しいんですよねぇ笑。

僕の場合、1つの記事を書いたら、それに関連する記事ネタが、ぼんぼん出てくるので、どうしてもCSSの記事を書いたら、次に書く記事も、それに関連する記事になっちゃうんですよね。今のところ、あと数記事は続きそうな感じです。

Posted by ナポリタン寿司