Skip to content

How to block distractions using uBlock Origin

New Course Coming Soon:

Get Really Good at Git

A trick I learned to block distractions using uBlock Origin

As everyone I am constantly distracted on the Internet.

Distractions are a pain.

I do use SelfControl, a nice app for Mac to block websites that I know are a source of distractions. Like Reddit and news sites. It’s common for me to open a news site when I’m facing a problem I can’t solve or I’m doing meaningful work.

But sometimes I can’t really block a whole site. For example, StackOverflow can’t be blocked. Yet it really annoys me with some of its UI like the network questions.

Sometimes those questions are really interesting for the lizard brain looking for the optimal distraction to move you away from what you are supposed to do.

I pick this random StackOverflow page, and while I’m reading about some JS, I am interrupted by interesting questions like:

I didn’t care about those topics before, but now I want to know the answer, just because I saw the question.

I am just trying to fix my problem, not distract myself more with random questions from random sites in the StackExchange network.

There’s a quick solution to solve this.

I use uBlock Origin and I just found out how to use it to block portions of a page with a simple click.

Click the uBlock Origin extension icon, click the picker icon to enter element picker mode, and then select one part of the page you want to hide forever.

Then click the “Create” button:

And it will be gone. Reload the page, it’s still gone.

This will bring back some bits of lost productivity until the next redesign, or when an HTML class name changes.

This should for any website, but in reality on some sites this is not that easy to make it work. The reason is the proliferation of automated CSS classes/ids. This method uses CSS to block out parts of a page. I tried on Twitter and selecting one block gave me this:

I’m not sure, but one could argue that this garbage is done on purpose. It changes on every rebuild, making it impossible to customize the page using this tool.

I can’t block Twitter completely as I sometimes use it, and I would like to block “Trends for you”, “Who to follow”, “You might like” and so on, so I can open Twitter without being sucked into an hashtag. But apparently I can’t do it this way.

Are you intimidated by Git? Can’t figure out merge vs rebase? Are you afraid of screwing up something any time you have to do something in Git? Do you rely on ChatGPT or random people’s answer on StackOverflow to fix your problems? Your coworkers are tired of explaining Git to you all the time? Git is something we all need to use, but few of us really master it. I created this course to improve your Git (and GitHub) knowledge at a radical level. A course that helps you feel less frustrated with Git. Launching May 21, 2024. Join the waiting list!

Here is how can I help you: