4

Remove ads from your Twitter timeline with a few lines of CSS

 1 year ago
source link: https://pawelgrzybek.com/remove-ads-from-your-twitter-timeline-with-a-few-lines-of-css/
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.

Remove ads from your Twitter timeline with a few lines of CSS

Published: 2022.08.13 · 1 minutes read

Twitter timeline is full of ads, and the “What’s happening” section is nothing else, just crap that I don’t care about. That is the main reason why I use TweetDeck instead.

Inspired by Šime’s “How I Added Scroll Snapping To My Twitter Timeline”, I decided to clean up my Twitter timeline, removing all the promoted tweets and this rubbish on the sidebar. Have a look at the before and after!

Twitter timeline before and after adding custom CSS

The trick is simple — you must add a few lines of CSS to hide the unneeded stuff. Then, using Safari, you can pick a custom stylesheet in Preference’s Advanced tab. Stylus extension is the way to go for Chrome and Firefox users.

Advanced Settings in Safari allow you to specify a custom stylesheet

These few lines of code are all I added to my custom stylesheet. Of course, it is not perfect and will break if Twiter changes the markup, but it does the job now. I have no more promoted tweets, politics, or football news on my timeline.

/* hide promoted tweets */
:has(meta[property="og:site_name"][content="Twitter"])
  [data-testid="cellInnerDiv"]:has(svg + [dir="auto"]) {
  display: none;
}

/* hide what's happening section */
:has(meta[property="og:site_name"][content="Twitter"])
  [aria-labelledby="accessible-list-0"] {
  display: none !important;
}

Hopefully, that helps. Bye 👋

Comments

  • Josta Yee
    2022.08.13, 10:55, #3879d430

    "hide what's happening section" hides my timeline, too.

Leave a comment

Name:

Website (optional):

Twitter (optional):

GitHub (optional):

Comment:

👆 you can use Markdown here

Save my data for the next time I comment


About Joyk


Aggregate valuable and interesting links.
Joyk means Joy of geeK