【Stylebot】「ツイートをプロモーションする」を非表示にするCSS

2022年3月16日Stylebot&Stylus

Stylebotのアイコン

この記事では、Twitterのツイートアナリティクス(詳細)のポップアップ下部に表示される「ツイートをプロモーションする(Proに切り替え)」を非表示にするCSSについて書きます。

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

【Stylebot】「ツイートをプロモーションする」を非表示にするCSS

Twitterのツイートアナリティクスのポップアップ下部に表示される「ツイートをプロモーションする Proに切り替え)」を非表示にするCSSです。Chrome、Firefoxどちらでも利用でき、ダークブルー、ダーク、ライトどのテーマを使っていても可能です。

Twitterのツイートの右下にあるツイートアナリティクスボタンをクリックすると、ツイートアナリティクス画面が表示されます。いいね、リツイート、コメント数、インプレッション数、エンゲージメントなどの詳細情報が確認できるポップアップです。

Twitter Proに登録していないと、その画面内の下半分に、「ツイートをプロモーションする」という固定のメニューが表示されるようになっています。

ChromeやVivaldiブラウザの場合、ポップアップ内をスクロールできるので困らないのですが、Firefox、Firefox派生ブラウザ(Floorpなど)では、スクロールできなくて、「新しいフォロワー、プロフィールへのアクセス数」が被って見えません。かなり不便です。

ブラウザ側で改善されるといいのですが、待ってられないので、自分で非表示にしてみました。

同じように、「ポップアップが見えなくて邪魔!だけど、Proに切り替える必要性は感じられない!」と悩んでいる方、試してみてください。Proに登録しなくても非表示にできます。

Twitterのツイートアナリティクス下部に表示される「ツイートをプロモーションする」ポップアップ

Stylebotは、Chrome拡張機能だけでなく、Firefox、Microsoft Edgeアドオンも用意されています。

インストール方法

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

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

Firefox・Edgeをご利用の場合

Chrome拡張機能だけでなく、Microsoft EdgeFirefox版もあります。

「Chromeに追加」でインストールできます。

Stylebot - Chrome ウェブストア

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

CSS

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

拡張機能ボタン Stylebotを開く

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

/*ツイートアナリティクス下に表示される「ツイートをプロモーションする」非表示*/
div[aria-labelledby="modal-header"] div[class*="r-1phboty r-5kkj8d r-1p0dtai r-18u37iz r-1d2f490"] {
  display: none;
}

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

ツイートアナリティクス下に表示される「ツイートをプロモーションする」を非表示にするCSS

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

Stylebot 「twitter.com」がオンになっている画像

CSSを書き込んだら、瞬時に反映されます。試しに適当に自分のツイートの右下にあるツイートアナリティクスボタンをクリックして、ツイートアナリティクス画面を表示します。「ツイートをプロモーションする(Proに切り替え)」の固定メニューが綺麗さっぱり消えています。

導入前と導入後の比較画像 Twitter Proの勧誘うポップアップが消える

ダークブルーだけでなく、ライト、ダークテーマを利用している場合でも反映されます。これで、ポップアップ内のスクロールができないFirefox、及び、その派生ブラウザでも「新しいフォロワー、プロフィールへのアクセス数」の数字を確認できます。

ライト、ダークテーマを使っていても反映される
2022年5月追記

後で気づいたのですが、ここのポップアップ、Twitterプロにしていても表示されていました。

本記事のCSSを適用することで、非表示にできます。

ツイートアナリティクス下の「このツイートをプロモーションする」ポップアップを非表示にした前と後の比較画像

感想

以上、Twitterのツイートアナリティクスの下に表示されるTwitter Proの勧誘ポップアップ「ツイートをプロモーションする」を非表示にするCSSについてでした。

Posted by ナポリタン寿司