My uBlock Origin filters to remove distractions

[mig4ng]

Repository with my filter lists that block some distractions from sites I want to keep using.

I am pretty ruthless removing distractions from my life (e.g. no Instagram, Facebook, TikTok), but some tools I'd like to keep using some parts of it. E.g. Twitter/X, I dislike the feed but I like reading some threads that are shared here or on blog posts. Same for YouTube, I enjoy some videos but I do not want recommendations when I finish the video I was watching.

Feel free to suggest more, open issues, pull requests or send me an email :)

[perihelions]

Tangentially: after you've blocked a very large number of ads and sidebars, one useful enhancement is to expand whatever text elements remain, to regain use of all that now-empty whitespace. Something like so:

    :xpath(//main/div):style(min-width: 80% !important)

(I've been looking at going a step further for some sites, by annotating a "column-count:" [0] rule and making the screen look like a newspaper. (Narrow columns for readability—multiple columns for "scan-ability"). Unfortunately, there's a lot more fiddling and tuning to this than I expected: it doesn't automagically work in the way you'd hope. Modern website DOM layouts are basically Superfund sites).

[0] https://developer.mozilla.org/en-US/docs/Web/CSS/column-coun...

[late edit]: Here's a minimal example of "column-count:" injected by uBlock (on a website where it sort-of works)—this is what I'm trying to coerce other websites into looking like:

https://i.ibb.co/k3bRwhP/example-1.webp

    theguardian.com###maincontent:style(margin-left: -28vw !important; min-width: 90vw !important; column-count: 4 !important)
    theguardian.com##div:style(border: none !important)

[flir]

Are you at the point where you should be pouring this content into RSS, and styling it as columns in a reader?

(I really like the column idea, and I'm working back towards RSS, with a bunch of smart filters, being my primary way of interacting with anything I visit regularly. I never should have given it up).

[notRobot]

It would be cool if you could figure out a way to have this work on top of FF's reader view.

[dredmorbius]

I'm quite the fan of various site restylings, using both uBO and Stylus.

But often just switching to Reader Mode is the faster and preferable option.

(This isn't always an option, but frequently is.)

[mig4ng]

The first one is a nice trick. Sometimes websites get broken when you remove some elements. Thanks!

[gzer0]

If you go to Options > Filter Lists > Annoyances and check mark the following items:

  "AdGuard – Annoyances"
  "EasyList – Annoyances"
  "uBlock filters – Annoyances"

You will get rid of 99.9% of website annoyances without affecting any main functionality of websites.

I've been doing this on every fresh install of Chrome for years. Works wonders.

[runjake]

If you use uBlock Origin, did you try to submit these filters to the uBlock Annoyances[1] or EasyList Annoyances lists before starting up this project?

That would help far more people that starting up yet another Annoyances list.

1. https://github.com/uBlockOrigin/uAssets

[notsylver]

These aren't just annoyances, they are core features of the sites.

[gxnxcxcx]

PSA: Some annoyances lists can be zealous about removing from websites any visual cue indicating the availability of an RSS feed.

[mig4ng]

I didn't know about this. Might add them to my filters, and see if mine apply there too. Thanks.

[aendruk]

Personally I have to hide Stack Exchange’s trending questions on my work machine. Those things are catnip to me.

  askubuntu.com###hot-network-questions
  serverfault.com###hot-network-questions
  stackexchange.com###hot-network-questions
  stackoverflow.com###hot-network-questions
  superuser.com###hot-network-questions

Also many sites disregard prefers-reduced-motion, so I’m often hiding visual distractions like endless carousels and cute decorative animations.

[knodi123]

> Those things are catnip to me

lol, I go over to try and solve a react component lifecycle question, and then click over to a Dungeons And Dragons esoteric rule edge case.

[dylan604]

for the longest time, i never paid attention to that column, as my brain has pretty much been trained that anything in that column is useless fluff. until one day when i actually read some of those questions and was surprised by the questions being asked. i totally get the catnip. luckily, i have an off switch and can avoid becoming addicted.

[mxmlnkn]

Same here! Although my rules look a bit different because I simply use the element picker:

    stackoverflow.com##.c-pointer.js-quack-btn
    stackoverflow.com##.js-step01.js-step.step.ws-nowrap
    stackoverflow.com##.js-step02.js-step.step.has-width.ta-center
    stackoverflow.com##.quack-popover--arrow
    stackoverflow.com###overlay-header
    stackoverflow.com###feed-link
    stackoverflow.com##.mb16.s-anchors__default.s-anchors.s-sidebarwidget__yellow.s-sidebarwidget
    stackoverflow.com##.grid--cell.js-reactions
    stackoverflow.com##.mb16.s-anchors__grayscale.s-anchors.s-sidebarwidget__yellow.s-sidebarwidget

Unfortunately, I also didn't comment what these are all for. But I think one of them is the banner, which might contain calls for voting and such. Another is the "Featured on Meta" box and the sidebar on the left which I never use. And the most recent thing, which isn't included above is the obnoxious popup for the "New Search AI Experience".

And this does not even include the goddamn cookie banners, for which ublock has a separate rule set fortunately. Unfortunately, it's the rule set that leads to the most problems because some sites don't work correctly or don't load at all when the cookie banner has not been interacted with. I hate the modern internet without ublock.

[mig4ng]

These are awesome, feel free to contribute to the StackOverflow PR in the repository: https://github.com/mig4ng/ublock-origin-filters/pull/4

[waxali9815]

I use something similar to this, the only differences are because my use case is privacy protection and avoiding algorithmic feeds. I use the Redirector extension for Firefox so that it redirects e.g. Youtube, Twitter, and StackOverflow links to the corresponding alternative frontends Piped, Nitter, and AnonymousOverflow. You can find maintained lists [1] [2] of such projects and their instances. Mostly they are FOSS and privacy-respecting, and they have distraction-free frontends because it's a helpful coincidence of being ethical software.

[1] https://github.com/digitalblossom/alternative-frontends [2] https://farside.link

[mig4ng]

This is amazing. I had similar ideas in my bucket list of creating distraction free alternatives and redirecting somehow.

Happy to know someone had the same idea and there are versions of it online. Thanks for letting me know of this, I really appreciate it!

[perihelions]

A while back I worked out how to erase the pay-to-win monetization spoor from Reddit and Twitter,

    reddit.com##.awarding-icon
    reddit.com##.awardings-bar
    reddit.com##.give-gold-button
    
    twitter.com##:xpath(//div[contains(@style, "hex-hw-shapeclip-clipconfig")]):style(clip-path: circle(50%) !important)

[lapetitejort]

Reddit has ended awards (for now). The filter is still applicable for older posts though.

[mig4ng]

What does the last one do?

[hedora]

This one gets rid of the Login With Google popups that have infested most corners of the internet:

   accounts.google.com/gsi/iframe

It doesn't break the login with google button, so you can still login with your google account, if you must.

[bloopernova]

Here's my filters in ublock origin for Hacker News:

    news.ycombinator.com##.comment:style(max-width: 70ch !important; overflow: hidden !important;)
    news.ycombinator.com##.c00:style(color: #3f3f3f !important;)
    news.ycombinator.com##.comhead:style(background: #e6e6df; font-weight: italic; color: #686868 !important;)
    news.ycombinator.com##.hnuser:style(background: #e6e6df; font-style: italic; color: #575757 !important;)
    news.ycombinator.com##html:style(filter:invert(100%) hue-rotate(180deg); background: white)

Restricts width of comments so that they're about 10 or so words wide, for optimal reading. Also changes some of the colours.

Experiment with the above, and if you have any improvements please let me know!

[beltsazar]

I'm using uBlock similarly! I've accumulated hundreds of custom filters for the past eight years. My newest entries on uBlock's "My Filters" tab are for hiding spoilers on IMDb:

  ! 2023-09-05 Hide episode's description and image (+ watchlist for not breaking the layout) [new experimental IMDb layout]
  imdb.com##article.episode-item-wrapper .ipc-slate
  imdb.com##article.episode-item-wrapper .ipc-html-content
  imdb.com##article.episode-item-wrapper .ipc-watchlist-ribbon

  ! 2023-09-05 Hide top rated episode's description both on a TV page and an episode page
  imdb.com##[data-testid="episodes-top-rated-card"] ul + div

[RexM]

Might want to also hide the number of episodes an actor is in the show for. That’s bitten me a few times.

[mig4ng]

Do you have the others open sourced? Mind sharing them?

[noname120]

Arc has native support for cosmetic improvements. Those are called Boosts and you can interactively create your owns in just a few clicks, and also add custom CSS/JS if needed.

I use this extensively to declutter/dedistract most websites I visit: Facebook, Twitter, Reddit, Medium, Gmail, YouTube, and so on. It's a real life-changer!

See the Boosts shared by other users here: https://arc.net/boosts

[mig4ng]

I really like the vertical tabs of Arc. I have actually used Firefox vertical tabs with nested tabs in the past and I loved the worflow.

Being able to have the rabbit whole of tabs when you are going deep on some topic very self contained is awesome. When I am finish, closing the group would clean all my tabs except the ones I wanted in the first place. I miss that.

I do not use it right now because it took me some time to setup, and there was no easy way of making it declarative (as code) for sharing across devices and keeping the config for future use. I might try it again if I find a way.

In regards to Arc, I gave it a go, but I dislike some things:

- It is not open source, neither the boosts, as it appears.

- It is Chromium based. I want Firefox or others to keep having a share in the market. I don't dislike or hate google, but I do not want a company to dominate the web (might be too late?).

- Only available in macOS, iOS ?! Not sure if it is still the case.

[AlwaysRock]

This is cool. I did something similar at one point. Unfortunately these websites change their basic layout so often that it felt like these fixes would work for 1 month max then I'd have to configure again.

I ended up moving to news feed eradicator. https://chrome.google.com/webstore/detail/news-feed-eradicat...

I let myself use reddit for 5 minutes every morning. It auto blocks the feed when those 5 minutes are up. Every other site I just leave blocked.

[ronjouch]

Thanks! I do this all the time too :) . Makes for a more pleasant / less cluttered experience on sites I use a lot.

I'll add that another thing that is pretty easy to do is to add a Dark Mode to websites that don't have one. All you need is a userContent.css/uBlock rule like

    @media (prefers-color-scheme: dark) {
        body {
            background-color: #111 !important;
            color: #eee !important;
        }
        /* etc, more stuff here depending on site */
    }

, and ta-da! Dark mode respecting your OS dark/light setting based on pref or time of day :)

[notpushkin]

Dark Reader extension does basically this (I think they either change colors or add the invert filter depending on what looks better?), but also has builtin CSS override rules for many sites. Love it.

[mig4ng]

Thanks for sharing. I don't use Dark mode but someone might be interested in this!

[SushiHippie]

For read only I really like these privacy friendly alternatives:

Twitter, completely skinned down to just the content and no login nags:

Nitter - https://nitter.net - https://github.com/zedeus/nitter

Youtube, also very skinned down and you can also collapse recommendations by default etc.:

Piped - https://piped.video - https://github.com/TeamPiped/Piped

Invidious - https://invidious.io - https://github.com/iv-org/invidious/

Stackoverflow, also completely skinned down to just the content and nothing more:

AnonymousOverflow - https://code.whatever.social - https://github.com/httpjamesm/AnonymousOverflow

For all of these I use LibRedirect to redirect the original pages to the open source/privacy friendly frontends:

https://libredirect.github.io/

[joveian]

Thanks! I just tried Invidious and like that it works even without javascript, although videos are limited to 720 resolution. Search works and you can even load some of the YouTube comments without javascript.

[dcminter]

Mostly I'm using one of the default uBlock origin ones, but custom rules that have made (desktop) Facebook much pleasanter for me:

  www.facebook.com##div:nth-of-type(8):has-text(Suggested for you)
  www.facebook.com##div:nth-of-type(8):has-text(Reels and short videos)

[rschiavone]

There is also https://letsblock.it/filters, a collaborative repository of uBlock content filters, to which I encourage you to contribute your own ones.

[mig4ng]

I found that and I actually link it in the repository. I will investigate it later.

[philip1209]

I use similar filters in my uBlock origin. I like this approach because it avoids installing more browser extensions, each of which risks security or privacy issues.

[mig4ng]

Please share them to see if I can improve mine :)

[db48x]

I do a lot of the same things to remove sidebars, navigation, suggestions, search, etc from various sites. There are a couple of web comics where I nuke everything but the image and the next/previous navigation links (Order of the Stick, Schlock Mercenary, etc).

[mig4ng]

Feel free to share them in the repository via PR, issue, or here :) Thanks.

[squarefoot]

Interesting. I wonder how hard would be to create a filter to programmatically eliminate certain sellers from Ebay query results, say those known for selling counterfeit hardware, those with feedback ratings below a given threshold, etc.

[crtasm]

Unfortunately the search results page doesn't appear to include the seller id or username for the items.

However if you had a list of usernames to exclude eBay lets you do that in the advanced search.

[cantSpellSober]

I've written so many of these. Any reason you chose uBlock over something like userstyles?

I'd like to open source/release my styles but I'm not sure which is the best choice.

uBlock is great for blocking things from loading (like images) but for visual updates I prefer CSS.

[kup0]

Using rules to completely block shorts from appearing in any YT feeds (and rules to fix the feeds so they don't look broken afterwards) has been great. YT breaks it from time to time with a UI update, but it's something I'll always use. I hate YT Shorts

[mig4ng]

Share yours on the repo via issue/PR or share them here. Thanks!