Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/sindresorhus/refined-twitter

Browser extension that simplifies the Twitter interface and adds useful features
https://github.com/sindresorhus/refined-twitter

browser-extension chrome-extension javascript twitter twitter-extension userstyle

Last synced: about 1 month ago
JSON representation

Browser extension that simplifies the Twitter interface and adds useful features

Awesome Lists containing this project

README 

        
# Refined Twitter



> Browser extension that simplifies the Twitter interface and adds useful features



**This project is not maintained anymore. Twitter rewrote their website and completely broke this extension, and it's much harder to reliably modify the new website. I also don't have time to fix these things and no one has stepped up to do so either. It had a great run. Thanks for all the love.**



We use Twitter a lot and notice many dumb annoyances we'd like to fix. So here be dragons.



## Install



- [**Chrome** extension](https://chrome.google.com/webstore/detail/refined-twitter/nlfgmdembofgodcemomfeimamihoknip)

- **Opera** extension: Use [this](https://addons.opera.com/en/extensions/details/download-chrome-extension-9/) to enable installing Chrome extensions and then install [Refined Twitter](https://chrome.google.com/webstore/detail/refined-twitter/nlfgmdembofgodcemomfeimamihoknip)



*Note: You **must** be logged in for this extension to work.*



## Highlights



*You can configure many of these features in the extension settings.*



- Simplified and improved UI.

- Hides promoted tweets.

- Auto-loads new tweets in the stream if you're scrolled to the top. No more clicking `See 3 new Tweets`!

- Fixes the file extension when saving images in tweets. No more `foo.jpg_large`!

- Uses the system font.

- [Embeds the photo from Instagram links directly in the tweet.](https://user-images.githubusercontent.com/170270/34315380-12d52994-e77f-11e7-8e23-27b76aee4df2.png)

- Improves performance. [1](https://github.com/sindresorhus/refined-twitter/pull/14) [2](https://github.com/sindresorhus/refined-twitter/commit/23897e251d2bc8d59526129ce54c7a5bf1ef884c)

- Hides "Liked" tweets in the stream.

- [Hides "And others follow" tweets in the stream.](https://user-images.githubusercontent.com/5341072/39945031-cc81125a-5560-11e8-8334-ea310a9dfdad.png)

- [Syntax highlighting in code blocks.](https://github.com/sindresorhus/refined-twitter/issues/37)

- [Adds Markdown-like styling of `text wrapped in backticks`.](https://user-images.githubusercontent.com/12901172/38168571-d9bd82ea-351d-11e8-9858-0d7c8993cdd3.png)

- Uses the original image in tweet image galleries instead of a downsized version.

- [Removes the annoying suggestions in the search popover.](https://user-images.githubusercontent.com/170270/33800304-70198358-dd3d-11e7-9870-477a44f74f4d.png)

- Hides "Notifications" activity for new followers and being added to a list.

- Preserves unsent text in the Messages modal when it closes.

- Highlight your mentions in the stream.

- [Adds a `Likes` button to the main navbar.](https://user-images.githubusercontent.com/14620121/35988497-ace9f93e-0ce5-11e8-8675-17e6ee38cd99.png)

- Keyboard shortcut to toggle Night Mode (Altm).

- Uses your personal color theme on all profiles.

- Hides the header image on profile pages.

- [Shows alternative image text below images when available.](https://user-images.githubusercontent.com/170270/40556400-b46c292c-6076-11e8-8241-f5c4e1a7a161.png)



Tip: Twitter has a native [dark mode](https://github.com/sindresorhus/refined-twitter/issues/10) and you can toggle it using Altm. And press Shift ? to see all keyboard shortcuts.






## Customization



See the extension settings for what can be configured.






We're happy to receive suggestions and contributions, but be aware this is an opinionated project. There's a high bar for adding options.



This doesn't necessarily limit you from manually disabling functionality that is not useful for you. Options include:



1. *(CSS Only)* Use a Chrome extension that allows injecting custom styles into sites, based on a URL pattern. [Stylus](https://add0n.com/stylus.html) is one such tool. [Example](https://github.com/sindresorhus/refined-github/issues/136#issuecomment-204072018)



2. Clone the repository, make the adjustments you need, and [load the unpacked extension in Chrome](https://developer.chrome.com/extensions/getstarted#unpacked), rather than installing from the Chrome Store.



## Contribute



Suggestions and pull requests are highly encouraged!



In order to make modifications to the extension you'd need to run it locally.



Please follow the below steps:



```sh

git clone https://github.com/sindresorhus/refined-twitter

cd refined-twitter

npm install    # Install dev dependencies

npm run build  # Build the extension code so it's ready for the browser

npm run watch  # Listen for file changes and automatically rebuild

```



Once built, load it in the browser of your choice:



	

		Chrome

		Firefox

	

	

		

			
    

    				
  1. Open chrome://extensions

    				
    2. 

  2. Check the Developer mode checkbox

    				
    3. 

  3. Click on the Load unpacked extension button

    				
    4. 

  4. Select the folder refined-twitter/distribution

    			
    5. 



		

		

			
    

    				
  1. Open about:debugging#addons

    				
    2. 

  2. Click on the Load Temporary Add-on button

    				
    3. 

  3. Select the file refined-twitter/extension/manifest.json

    			
    4. 



		

	



## FAQ



#### Don't you have another extension with the same name?



This is reusing the name from the [original Refined Twitter](https://github.com/sindresorhus/refined-twitter-old) extension, which tried to use the mobile Twitter version on the desktop. It was a good idea in theory, but not in practice. This extension instead improves upon the desktop version of Twitter.



#### Will this extension work if I'm not logged in?



[No](https://github.com/sindresorhus/refined-twitter/issues/126).



## Links



- [Blog post](https://blog.sindresorhus.com/refined-twitter-74038424fe2a)

- [Product Hunt submission](https://www.producthunt.com/posts/refined-twitter)



## Related



- [Refined GitHub](https://github.com/sindresorhus/refined-github) - GitHub version of this extension