The simplest guide: Make your Twitter sidebar transparent and invisible

Also popular: 

• Create an animated background to look cool underneath your new transparent sidebar.
• How to move your Twitter timeline back to the left.

Alternate directions with browser bookmarklet

So many people are failing to follow the directions properly about typing in the “javascript:” (don’t forget the colon—”:”—character at the end!) characters by hand, that I’ve created a bookmarklet to simplify things for folks.

1. Simply drag this box into the bookmarks/favorites bar of your browser: Clear My Sidebar!. It will look different on different browsers. Make a note of where you dragged it to on the top bar of your browser! You’ll need to click
2. Then, login to Twitter and go here: http://twitter.com/settings/design.
3. Clear your browser’s cache (see http://bit.ly/FixBrowser for tips).
4. Click the icon on your browser’s bookmarks bar where you dragged the “Clear My Sidebar” box. Click the save changes button at the bottom of the Twitter page. You’re done!

IMPORTANT!! Try the troubleshooting tips before leaving a comment that it “doesn’t work.” It still works. Explain what you tried if having problems.

A couple of notes:

• Once you change anything else, the transparent sidebar steps will have to be done again. So you may want to create a test account to experiment with, and then once you find the settings you like, use those on your main account.
• There is no way to make the whole page transparent. Just the right-hand sidebar.

Ultra simple: Paste the code shown below into your browser address bar here, press enter. The short version:

1. Login to Twitter and go here: http://twitter.com/settings/design. Clear your browser’s cache (see http://bit.ly/FixBrowser for tips).
2. Paste the code (copy it from below) into the address bar on your browser.
3. Check the code to see if your browser accepted it all. Type in “javascript:” (without the quotes) by hand at the beginning of the code you pasted in. (HT @amanda36c).
4. Press enter on your keyboard, and then click the save changes button. Clear your browser’s cache again (see http://bit.ly/FixBrowser for tips).
5. View your Twitter home page to see the result

A transparent sidebar is a bad idea if you have a background that is a similar color to your text—it may make your sidebar text seen almost invisible. Also, if your background image is very busy, it may just look bad with the text of your sidebar sitting on top of it. And if you are using “New Twitter” you may like: How To Add new media types to “New Twitter”

But if you want to try it, it’s very easy to do! It’s also easy to change it back if you don’t like it. Just follow these simple steps:

Works for new and old Twitter!

You must be logged into Twitter.com for this to work! And it seems to work best from old Twitter—you can switch back to New Twitter afterwards. Try a different browser if you get an error. Test show Twitter hasn’t changed this—it’s still working! You will likely have to reset your browser cache to see the results (see http://bit.ly/FixBrowser for tips).

It’s possible you won’t have to follow the steps in as much detail as I’ve put them down here, but this is what seems to work for everyone:

STEP 1: Click here to access your profile design settings: http://twitter.com/settings/design and then click the button for “Change design colors.” Now clear your browser’s cache (see http://bit.ly/FixBrowser for tips) and then copy the code between the lines below (don’t copy the lines!):

document.getElementById("user_profile_sidebar_fill_color").value = '';document.getElementById("title_theme").innerHTML = 'Click The Save Changes Button At Bottom To Finish!!';void(0);

STEP 2: Delete the URL (website address) in the address bar at the top of your browser (Where is my address bar? See also: Address bars in different browsers).

STEP 3: Paste the code in where the website address was and type “javascript:” (without the quotes) at the beginning of the line. Now press enter on your keyboard. The URL will probably return .https://twitter.com/settings/design?tab=colors

STEP 4: Find and click the “save changes” button just above the bottom of your screen. It should look like this:

STEP 5: Clear your browser’s cache again and check your profile page (see http://bit.ly/FixBrowser for tips)

You may not notice anything different, but you did it! (When you first enter the script and press enter, the example sidebar will not become transparent.) The sidebar on your Twitter page (go there to check) should now be transparent.

Click here to see your transparent sidebar

Didn’t work? Having a problem?

Tips to try first:

1. Turn off HTTPS Only…Always use HTTPS at http://twitter.com/settings/account
2. Check and type in anything by hand that didn’t get pasted over. For example, in Chrome, I need to type in “javascript:” (without the quotes) at the beginning of the line by hand. You may need to type  ”javascript:” (without the quotes) before pasting.
3. Try it from a different browser.
4. In some cases you may need to do a “hard” refresh of your web page. Do this by going to your Twitter page, and then holding down the “Ctrl” key on your keyboard (Command key on a Mac) while pressing the F5 (function) key at the same time. This should do a full refresh of your page.

It is also possible that at some future date Twitter will prevent this from working. If you have a problem, leave a comment below!

To change your sidebar back to a color

1. Make sure you are  logged into Twitter.com
2. Return to your design settings page: http://twitter.com/settings/design
3. Click the words “Change design colors” near the bottom of the page and you’ll see several colored boxes.
4. Click in the colored box under “sidebar”
5. Choose a color by clicking and moving your mouse around in the box of colors that pops up. It should look something like this: