広告を利用しています

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

【X(旧Twitter)】引用ポストの引用元を非表示にするCSS

X(旧Twitter)

「X(旧Twitter)」のアイコン画像

この記事では、PCブラウザ版「X(旧Twitter)」のポストのエンゲージメント(旧:引用リツイートページ)に表示される引用元ポストを非表示にして、スッキリさせるCSSについて書きます。

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

PCウェブサイト版「X(旧Twitter)」のポストのエンゲージメントページにある引用元ポストをCSSで非表示にした画像

通常、PCウェブサイト版「X(旧Twitter)」のポストのエンゲージメントページ(サンプル)を開くと、引用元ポストとそれに対するポストがセットで表示されます。引用元ポストの長さにもよりますが、少し邪魔と思う人がいるかもしれません。

PCウェブサイト版「X(旧Twitter)」のポストのエンゲージメント(旧:引用リツイートページ)画像

CSSを使うことでポストのエンゲージメント(旧:引用リツイートページ)上だけで、引用元のポストを非表示にできます。引用に対する内容ツイートだけが表示されるのでスッキリします。1ページに表示される情報量が増えます。

自身の環境上だけの反映です。他人には影響しません。いつでも元に戻せます。本記事はChrome拡張機能・Firefoxアドオンを利用できるPCブラウザ限定です。スマホやタブレットのアプリ版ではできません。

拡張機能を利用できるブラウザアプリ(例:Kiwi Browserは2025年1月で開発終了なのでMicrosoft Edge CanaryやFirefox)などをインストールしてCSSを書き込み、ブラウザ版から利用する場合はもしかしたら使えるかもしれません。

インストール方法

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

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

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

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

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

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

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

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

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

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

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

引用元ポストを削除する手順

ポストのエンゲージメントだけに適用するスタイルシートを作成する

今回は「X(旧Twitter)」上全体(ドメイン指定)ではなく、ポストのエンゲージメント(旧:引用リツイートページ)だけに反映したいので専用のスタイルシートを作成します。

「Stylebot」拡張機能アイコンを右クリック→「オプション」をクリックします。

「Stylebot」のオプションを開く手順画像

「Stylebot」拡張機能ではなく、「Stylus」拡張機能を利用している場合はこちらに飛んでみてください。

【ポイント】「Stylebotを開く」からではないので注意

いつものStylebotアイコンをクリック→「Stylebotを開く」からではないので注意です。

PCウェブサイト版「X(旧Twitter)」にアクセスして「Stylebot」で「x.com」のスタイルシートを作成しようとしている画像

ここからだと自動的にドメイン単位(x.com)での指定になります。通常のホームタイムライン上(https://x.com/home)でも引用元が消えてしまいます。

逆にポストのエンゲージメントページ(x.com/**/status/**/quotes)だけでなく、ホームタイムライン上でも消したい場合はドメイン単位での指定にします。

Stylebotアイコン→「Stylebotを開く」からドメイン単位(x.com)のスタイルシートを開けます。

PCウェブサイト版「X(旧Twitter)」のタイムライン上に表示される引用ポスト画像

左側の「スタイル」をクリックします。「新しいスタイルを追加」をクリックします。既にポストのエンゲージメント用のスタイルを作成している方はそちらに追記してOKです。

「Stylebot」拡張機能のオプションからスタイルシートを作成する手順画像

上部の入力フォーム(Enter URL…)にURLを書き込みます。書き込むURLは「x.com/**/status/**/quotes」になります。

x.com/**/status/**/quotes
「Stylebot」拡張機能で「X(旧Twitter)」のポストのエンゲージメントだけで動作するスタイルシートを作成する手順画像

引用元を消すCSSを書き込む

大きい入力フォームに以下のCSSを書き込みます。

CSS
/*引用リツイートの引用元非表示*/
.r-adacv.r-1ny4l3l.r-1udh08x.r-o7ynqc.r-6416eg {
    display: none !important
}
本コードについて

もしかしたらフォントの大きさ・利用しているテーマによっては動作しないかもしれません。そこまで検証していません。僕の環境だとダークブルーテーマでは動作しました。

他のテーマで動かない場合は問い合わせページから教えていただければ幸いです。その際本記事のURLを貼っていただけると、何のことかすぐに理解できます。

書き込めたら右下の「保存する」をクリックします。

「Stylebot」拡張機能のスタイルシートを保存する手順画像

x.com/**/status/**/quotes」のスタイルが登録されればOKです。

「Stylebot」拡張機能に「x.com/**/status/**/quotes」のスタイルシートを作成した画像

実際に消えたかの確認

X(旧Twitter)のポストのエンゲージメント(旧:引用リツイートページ)にアクセスします(サンプル)。

PCウェブサイト版「X(旧Twitter)」に「Twitter UI Customizer」拡張機能を入れてポスト下部から引用ポストページを開く手順画像

僕は「Twitter UI Customizer」拡張機能を導入しているのでポスト下部に「〇件の引用ツイート」が表示されていますが、通常は表示されないと思います。右上の三点ボタン→「ポストのエンゲージメントを表示」を押します。

開いたら「Stylebot」拡張機能アイコンの右上に数字が表示されていて作成したスタイルシートが表示されていたらOKです。もしここに表示されていない場合は何かしらURLの記述がミスっていることになります。

PCウェブサイト版「X(旧Twitter)」のポストのエンゲージメントページで「Stylebot」のスタイルシートが有効になっているか確認する手順画像

もしかしたら人によってはまだ「twitter.com」で「x.com」のスタイルシートが効かないってパターンもあるかもです。その場合「twitter.com」に書き換えます。

引用元のポストが丸々非表示になります。引用に対する内容だけになるので非常にスッキリします。リプライ(返信欄)みたいな感じになります。

PCウェブサイト版「X(旧Twitter)」のポストのエンゲージメント(旧:引用リツイートページ)の引用元をCSSで非表示にした比較画像

一時的に無効化したい場合は、「Stylebot」拡張機能アイコンを左クリック→「x.com/**/status/**/quotes」をオフにします。完全に使わなくなった場合は書き込んだコードを削除します。

「Stylus」拡張機能を利用している場合

Stylusスタイラス」拡張機能を利用している場合、「X(旧Twitter)」のポストのエンゲージメントを指定するURLは以下のようになります。

.*x.com/.*/status/.*/quotes.*

「Stylebot」のワイルドカードに対して「Stylus」では正規表現になります。正規表現における「.*」が任意の文字1文字以上という意味です。色々な書き方があるので上記だけが正解じゃないです。

上記URLを「Stylus」のURL欄に貼り付けます。この時、左側の項目は「正規表現に一致するURL」にします。これで動作すると思います。

「Stylus」拡張機能で「X(旧Twitter)」のポストのエンゲージメントページだけで動作するスタイルシートを作成する手順画像

タイムラインから引用リツイートを非表示にしたい場合

以下の記事を参考にしてみてください。

感想

以上、PCブラウザ版「X(旧Twitter)」のポストのエンゲージメント(旧:引用リツイートページ)に表示される引用元ポストを非表示にするCSSでした。

最近イーロン・マスクさんによるX大改革が止まりませんね。

余談ですが、本記事のスクリーンショットに映っているポスト下の各種ボタンは、以下の記事で紹介している拡張機能を利用することで好きなようにカスタマイズできます。僕はツイートの表示回数を消してリンクのコピーボタンを設置しています。

2023年2月13日X(旧Twitter)

Posted by ナポリタン寿司