Welcome to Code Couch

Resizing the left-hand labels column in Gmail – now OK with the March 2013 Gmail updates

Posted by at 5:59pm on March 31, 2013.

Note: These instructions are only for users who use the resizer code as either a Chrome extension/userscript or Greasemonkey userscript. Users who are using the bookmarklet version need not read any further!

Gmail changes

At some time in the last week or so, Google updated Gmail to provide new UI elements. Exactly what other changes were made, I can’t say… but around the same time, my Gmail label column resizer stopped loading.

It turns out that the resizer code itself was fine, as the bookmarklet version still worked. What I suspect had changed was something around the loading of their Gmail Greasemonkey API.

Every cloud has a silver lining, so the saying goes… and the silver lining to this was that I’ve updated my wrapper code to be identical for both Chrome userscripts and Greasemonkey userscripts. This was achieved by adding meta information to tell Greasemonkey that my code doesn’t need to be granted rights to use any of its "GM_"-prefixed functions, negating the need to use the "unsafeWindow" prefix.

A while ago, Google made Chrome more secure by restricting the ways that userscripts could be installed: now they have to be installed in the Extensions settings. I’ve given updated step-by-step instructions for this below, which should help some users who were finding my old instructions no longer worked.

Instructions for Firefox/Greasemonkey users

Greasemonkey users probably already know how to add userscripts, so I’m only providing instructions for Chrome users here. As mentioned above, the wrapper is now identical, so you should be able to use it without having to modify the code (tested against Greasemonkey 1.8 in Firefox 19.0.2). Remember: the use of the "unsafeWindow." prefix is no longer needed with the new wrapper code below.

Instructions for Chrome users

  1. Copy the code below into a text editor
  2. Copy the “full monty” code from my previous post and paste it into the text editor after the line that reads “// Insert code here…”
  3. Save the file with a name that ends in “.user.js”, for example, “chromeGmailResizer.user.js”. Note: the “.user.js” extension is important as tells Chrome that this code is to be installed as a user script
  4. Go into your Chrome extensions settings (either enter "chrome://extensions" into the address bar, or use the Chrome menu to visit "Tools" then "Extensions"
  5. You should see a page similar to this:
  6. Using the file manager for your operating system, drag the file into the Chrome Extensions page. You should see a message similar to this:
  7. Drop the file into the Extensions page. You should see a message similar to this:
  8. Click the "Add" button, and you should see a confirmation message similar to this:
  9. Load Gmail, and after a short delay, you should see the grab bar ready to go!

The new wrapper code

// ==UserScript==
// @name           Gmail label column resizer
// @namespace      http://www.codecouch.com/
// @description    User script that allows the labels column in Gmail to be resized
// @include        http://mail.google.com/*
// @include        https://mail.google.com/*
// @match          http://mail.google.com/*
// @match          https://mail.google.com/*
// @version        1.2
// @history        1.2 Allow 10 seconds for the Gmail Greasemonkey API to load, Chrome & GM userscripts now share same code
// @history        1.1 Stopped duplicate grab bars and added more URL matching
// @history        1.0 Initial version
// @grant          none
// ==/UserScript==
 
var addGmailResizerToPage = function() {
 
	function loadGmailResizer() {
		// Insert code here...
 
	};
 
	// Test for the presence of the Gmail Greasemonkey API once per second. Give up if not present after 10 seconds
	var loadCount = 0;
	function testForGmonkey() {
		loadCount++;
		if (loadCount == 10) clearInterval(timerHandle);
		if (typeof(gmonkey) == 'object' && 'load' in gmonkey) {
			clearInterval(timerHandle);
 
			// Only load the resizer code if it hasn't already been run (stops multiple grab bars from appearing)
			if ('loadedGmailResizer' in top) return;
			top.loadedGmailResizer = true;
			loadGmailResizer();
		}
	};
	var timerHandle = setInterval(testForGmonkey, 1000);
 
};
s = document.createElement('script');
s.type = 'text/javascript';
s.textContent = '(' + addGmailResizerToPage.toString() + ')()';
document.body.appendChild(s);

Post to Twitter

Comments

There are 22 responses to this post.

  1. I am desperate to get this to work with chrome but all I get is the 2 lines down the left side but they won't move! Help?
  2. @Jacki: Do you have any other labs or Gmail plugins enabled, or other scripts or extensions that do anything to modify or enhance the Gmail interface or functionality? If so, disable every single one of them and refresh the page to see if that helps.
  3. @Jacki: Also, what operating system version and what version of Chrome are you using?
  4. Thank you so much, that worked!! Been trying for years, so like the other lady said I will have your babies too! (I disabled utorrentbar, it won't work with that)Being picky does it have to be resized every time you access gmail, it doesn't stay like that?
  5. Hi This has so nearly worked...but fundamentally it hasn't...I get the grab bar to re-size the column but when I get passed the standard size the select, refresh, and settings tool buttons sink to the bottom of the page and emails can't be seen. It did not seem to be a problem with other plugins, but the tests I carried out were not conclusive...it seemed to fail when I was using my google apps account but ok when using standard gmail. Hope this can be resolved soon.
  6. This seems to have been resolved after I turned off the IMAP setting that I was running in google apps mail but not gmail. Would that make sense?
  7. @Jacki: I've released an updated version of the script that saves the width to a cookie and automatically reads it when the script is run. See my latest post for the code... you can still use the same wrapper code from this post. Shout if you have any problems with it!
  8. @Bob: That sounds weird... I've no idea why having IMAP enabled would do this, but I'm glad you've found a solution to the problem :-)
  9. Hi Dan, works great, thanks a million!
  10. Wow! Your instructions were understandable and allowed me to complete the task in less than ten minutes. Hooray for sizable left-hand labels. I'm very grateful, Dan!
  11. Work great! I found a small bug. After installing the extension you can not use the zoom -/+ in gmial. With zoom you get the same that Jacki Flanagan wrote. Chrome Version 27.0.1453.81 beta-m
  12. for some reason this has stopped working for me...if its just me then clearly its to do with my recent messing about...but is it just me?
  13. @Piotr: This seems to be due to a rounding error at one or two specific zoom levels. If you zoom in/out an extra time, chances are things will come right again
  14. @Bob S: It's still working for me in Chrome. Occasionally, it stops working, but if I enter "gmail.com" in the URL bar to reload Gmail, it all springs back to life. Give that a go and see what happens.
  15. Maybe I'm the only one who made this mistake, but I am posting this just in case others who can't get the extension to work made the same mistake: In step 2, where you wrote: "Copy the "full monty" code from my previous post and paste it into the text editor after the line that reads '// Insert code here...' I misunderstood this to mean that the pasted could should REPLACE everything from '//Insert code here...' downward. Of course, the extension didn't work. It took me a few minutes of rereading the instructions to realize that the "full monty" code should just be ADDED to the code, not replace any of it....just like you said. :-}
  16. Not sure what happened so I redid the extension and all ok now. A really great extra...thanks.
  17. I followed the guide and unfortunately it doesn't work for me. The resize bar just doesn't show. I'm using Enterprise Google Apps account and Chrome 28.0.1500.37 beta-m. Any ideas? Have you tested it with Google Apps account or only with private Gmail?
  18. @Michal Sz: I've been using it with my Google Apps account for over a year, in Chrome version from v20 upwards (I'm now on v29). Do you have any other labs or plugins that affect Gmail? If so, try disabling them and reloading the page to see if that helps.
  19. Thanks for this. Worked first time.
  20. Really useful idea, been bugging me for a loooong time. But when I drag the "jlakj.user.js" file to Extensions, it doesn´t install or do the pop-up box. It only displays the (contents of) the "user.js" file. What am I doing wrong here :) ?
  21. Awesome Extension! Thanks for sharing!
  22. @Morten: Which version of Chrome are you using?

Leave a reply

You must either log in or enter your name and email address to post a comment.

Your email address will not be published.

  • You do not need to log in to comment, but you can if you wish.
  • Log in