how I avoid distractions on Twitter
- not complete yet but people periodically ask me and I want an ongoing reference
- phone
- I don't have the mobile app installed and I keep myself logged out in the browser
- Why?
- Too easy to just scroll forever in the feed and click around and get lost.
- On my computer, mostly because of the keyboard, it feels a lot more downhill to reply to interesting tweets & start/continue conversations.
- in order to tweet showerthoughts or puns or even sometimes articles from my phone, I use this:
- IFTTT widget - post a quick tweet (link only works if logged in)
- desktop
- a hodge-podge of userstyles & userscripts
- it's not as easy as it kinda should be, but it's also really not that hard
- have some userstyles that hide Home & Notifications altogether
@-moz-document domain("twitter.com") { body[style*='background'], main { background: #400 !important; } body[style*='background']:nth-child(2)::before { content: "choose intent & scope before entering\a\a👁️";/* content: "no twitter atm\a\a🚀\a\a ...coding!"; */ color: white; color: #c00; text-shadow: 1px -1px 2px #fff; white-space: pre; text-align: center; display: block; width: 100%; top: 300px; position: absolute; font-size: 4.5vw; font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Ubuntu, "Helvetica Neue", sans-serif; } #react-root {display: none !important} #motion-extension {display: none !important;} } @-moz-document url-prefix("https://twitter.com/messages"), url-prefix("https://twitter.com/compose/tweet"), url-prefix("https://twitter.com/search?") { body[style*='background'] {background: inherit !important;} body[style*='background']:nth-child(2)::before {content: ""} #react-root {display: block !important} header[role="banner"] { background: #201 !important; } header[role="banner"] > * { display: none; } #motion-extension {display: block !important} #twemex--container {display: none} }
- make notifications less obnoxious (I basically hide them entirely except for DMs)
- Problem 😡 I wanting to leave a tweet open for reference or to reply to the thread... but the (1) in the title or the red dot in the favicon makes me end up checking notifications.
- Solution 😎 this custom userscript I just wrote
- Note that by default it removes the left sidebar when you're on a permalink as well, so that you're not distracted by notifications there either. I was already doing this with a userstyle, but I added it to the script for convenience. You can comment it out if you don't like that.
- hide notification numbers on the sidebar
@-moz-document domain("twitter.com") { [aria-label*="Notifications"] [aria-label*=" unread item"] { display: none !important; } }
- make compose less distracting
- old method
@-moz-document url("https://twitter.com/compose/tweet") { div[aria-modal="true"] { outline: 1000px solid black; } }
- quicksearches
- new version of chrome might make this harder, but you can change it back
- I have custom url search engines to quickly search for
tw= tweets in generaltwf= tweets from people I'm followingtwm= tweets from me
- how?
7 linked references
★ Redesigning Twitter
- #todo make tweetstorm about how I avoid distractions on Twitter
- userstyles
- tweetonly
- hide notification count
- block promoted tweets
- Focus Twitter Permalink
.PermalinkOverlay-modal {
top: 0 !important;
left: 0 !important;
margin-left: 0 !important;
right: 0 !important;
width: 100%;
height: 100%;
}
.PermalinkOverlay-with-background {
background: black;
}
div.PermalinkOverlay-content {
position: absolute;
top: 60px !important;
left: 50% !important;
width: 640px !important;
margin-left: -320px !important;
right: auto !important;
}
December 2nd, 2021
- oooh this is great (via Tasshin Fogleman)
November 10th, 2021
- good tweet to QT when discussing this
April 8th, 2021
- some good stuff from visakanv here: