So you can finally grab the Helvetimail at josefrichter.com/helvetimail. This took a lot of time, because Gmail html, css and js are extremely messy. Does anyone know why?
If you like Helvetimail, please see also my Helvetwitter.
Please use discussion under this blogpost to submit comments, report problems, etc. I am aware that Helvetimail is far from perfect and probably never will be, but I did what I could to make at least the basic functionality ok.
Thank you and enjoy!
Tags: gmail, google, helvetical, helvetimail, helvetireader, helvetwitter
Sweet, using it right now, hope you figure out the problem with it in fluid.
If I ever fully understand javascript, I would help. but im kinda slow when it comes to learning new things :p
This works in Mailplane.app!
Just download the CSS file here:
http://www.josefrichter.com/helvetimail.css
Go to Tweak UI in Mailplane’s Preferences.
Click Choose under the Custom Stylesheet section.
Select the downloaded CSS file.
Boom.
Thanks for telling me about Mailplane, looks decent, I’m gonna try it, if it’s good. I’m defenitley going to buy it
the css in mailplane doesn’t work for me. i see the minimalist themes background colors, and border styles with no overrides.
Hey Josef,
Just got a link to your Helvetimail from SwissMiss. I’m really excited. But, I can’t seem to get it to work in Firefox (my browser of choice). I’ve installed the Greasemonkey script, but my theme is still set to Minimalist…
…am I missing something?
In mailplane it looks not good. I mean not so good as in Firefox. Look http://bit.ly/3tKwZp
Mailplane v. 2.0.14(995)
Thanks Josef!
Not working so well here in Mailplane, David – does yours look better than this?
(screenshot)
I just tried helvetimail.css with MailPlane and the Minimalist theme. Looks like the CSS isn’t up to date, because I get this mess:
http://imgur.com/2UILb.jpg
Mailplane users, sorry for the problems. For some guys it works ok (as you can see here http://mailplaneapp.com/blog/entry/helvetimail_-_a_minimalist_gmail_skin/ ), for others it don’t. I will post an update as soon as I find out what’s the problem.
Thanks for understanding and sorry for inconvenience.
Mailplane users – the problem is you need Mailplane 2.1 BETA to make Helvetimail work. It won’t work under 2.0. Hope this helps. Thank you.
The Gmail logo ist not changing with Mailplane: http://img.skitch.com/20090914-8j8b5t9xqs4jru7yd8f2h4he47.png
@thomas Did you select “minimalist” theme from settings-themes in Gmail? That should fix your problem. If not, please let me know. Thank you.
How do I download?
@Josef thanks for the update! i installed the mailplane 2.1 beta, and am up and running. looks like helvetimail is coming along well. how about you put this on github so we can all contribute?
if you’re running mailplane, get the beta at: http://mailplaneapp.com/download/beta/
It worked nice in Google Chrome!
excellent work! have been eagerly awaiting this updated version, now the webapps i use most are all using the same beautiful theme.
small issue – GMail logo is not changing in Firefox. any fix?
@Dana, did you try to follow the instructions at http://www.josefrichter.com/helvetimail ? At which step did you get stuck, please?
@jonnybowley thanks for kind words! the problem with non-changing logo seems to be caused by Google Gears. Could you please try to disable Gears if it helps? I will try to make some workaround.
Works in Chrome
Chrome Screenshot:
http://img196.imageshack.us/img196/4964/helmail.jpg
Hi Joseph,
i switched to Gmeail today as your skin to the interface did convince me.
Unfortunately my Firefox+Greasemonkey doesnt work with me. First of all the stupid question: I do have to have Helvetica installed on my PC?
And secondly – with Minimalist skin the Googlemail-logo doesnt change here as well (and I dont have Google Gears installed).
Any hints?
Is there anyway to modify the background (running on Chrome w/userscript) Looks nice but there’s almost too much white space, thinking a nice gray to white gradation from the top to middle (or bottom up to middle) would balance things out. See http://helvetireader.com/ for an example.
thanks man, you rock.
Truly wonderful but I would love it more at Prism, standalone application. Please, think about it!!
Hey,
There’s a problem which I think is connected to the fact that the css file is imported from another website. I have an gmail account in my own domain with a forced SSL connection. This I think prohibits the css file from being imported. Could you write the script in such a way that the style.css would be downloadable and would work with the .js file?
I’m using Opera, if that’s importaint.
Love the clean look — works great for my personal Gmail as well as Google Apps in Firefox 3.5.3 on OSX. Is there any way to toggle the snippets back on (yes, I know this goes against the minimalist nature of the theme, but it helps my work flow).
Let me know.
Thanks,
Ross
The last step for setting up Fluid should be to press Command-Shift-H, not ctrl-shift-h
Hi Josef,
Thanks for this helvetimail. Works great in firefox. However, I have been able to get it working in Fluid with your new instructions. I suspected it may be that my settings required https, but tested that theory and it still doesn’t work. The script is definitely getting called as I threw an alert in there to make sure it was getting to the lowermost else case. Indeed, it does. But the styling never occurs. I’m running version 0.9.6 on Snow Leopard with the latest updates.
Thanks,
David
Ok, can anyone tell me how to install helvetimail?
Only guide in the site is “if you have greasemonkey, you’ll only need this” And then?!
Where should I put it?
Do I need to configure Greasemonkey?
To bad you hide the preview text right to the subject line in the overview. I always found that one of gmails stronger features.
@amilcar did you try my instructions how to make it work in Prism, please?
@joe could you please try to use the userscript for Safari/Fluid instead? – they have the whole CSS contained within, so no downloading from remote site occurs.
@Wes aah, thanks for correction!
@david sorry to hear that. making it work in Fluid was a real pain. Please try to disable an re-enable the script, then press cmd-shift-h. If this doesn’t work, please try to go thru the instructions once again from the beginning. never ever reload Fluid
not sure why, but it doesn’t work so well as in safari.
@joo sorry, you are right, the instruction is not entirely clear here. once you have greasemonkey installed, please click the userscript link and you will be prompted to install the Helvetimail userscipt. I updated the Helvetimail page. thank you.
@hanneski it seemed to me that you usually get nothing important from the first two sentences of most emails, that’s why I removed it
@ross First I have to take a look what ‘snippets’ are to see if they are worth re-enabling
Josef,
Here’s an interesting piece of information. I deleted all of the various Fluid SSB’s in my Applications directory corresponding to GMail. I then attempted to recreate a GMail SSB. After entering name, url, and icon as per your instructions, I launched the SSB. Surprisingly, it was already associated with the script called helvetimail from one of the earlier deleted SSBs and the script was activated in the menu (checked) but it still didn’t work. This has to be a bug. Clearly, fluid is keeping a hash between the name of the SSB and the script association or the like and this is living across SSBs even when it shouldn’t – i.e. deletion should clear that association. That may be why if you get it wrong the first time, you may never get it right as the association is fixed under the covers.
HTH! I’ll keep poking at it.
So I discovered that I need to delete the associated SSB stuff for fluid from my home directory in addition to the SSB app in applications to get around the problem I described above, but that didn’t allow helvetimail to render. Thinking about this, I wonder if the issue is the same as Safari on Snow Leopard – that the rendering engine needs to run in 32-bit mode as you describe under the Safari/Snow Leopard section. Or does the fluid solution require the entire stack of software including greasekit and SIMBL? The answer is non-obvious to me right now. Thoughts? Thanks!
@josef “snippets” are the first 2 lines of preview text that normally appear to the right of the e-mail subject; same thing that @hanneski was referring to. I find these most useful for identifying junk mail that somehow makes it to my inbox wihtout having to open the e-mail, and also for getting the gist of a message without having to open it.
Just my $0.02.
I encountered a problem with label colors (Gmail theme’s color was used instead of Heletimail’s one). I had to change
.n0 {
to
.n0, .G9 .hFJ3Dc .n0 {
to fix this.
I installed Helvetimail on Firefox using Greasemonkey, it works, but everything is in italic. Can i change that?
Have installed Fluid + script. All good until I try to login, at which point the user / passw boxes go wonky and I can’t fill in info properly. So I can’t access mail. Any ideas?
Working great in FF though.
Thanks – beautiful design.
@jorge italic??
If you disable Helvetimail, does the Minimalist theme display italics as well?
@tim could you please try to disable Helvetimail to log in and then enable it again? Fluid will remember the password of course.
@vyacheslav thank you!
@Mateus you need helvetica if you want it in helvetica
If you don’t have helvetica, it will use arial.
as regards the logo not changing – this seems to be some Gmail bug – the white logo shows up across all themes. Could you please check this discussion http://www.google.com/support/forum/p/Google+Apps/thread?tid=5299fcb20c585b03&hl=en
@meangene I will try to add the Helvetireader style gradient in upcoming versions
@beardpapa thank you
All i get is a cluttered login, deactivate the script to login, activate after login w/Minimalist theme, doesnt work. Safari user. Works fine in Opera tho
Dear Josef,
thanks for your swift answer…unfortunately still random ugliness here.
My System: Win Vista, FF 3.5.3, GreaseMonkey, No Gears
1. Minimal Theme Switched on: http://img7.imageshack.us/img7/8681/clipboard01iw.jpg
2. Heletica Family installed: http://img22.imageshack.us/img22/7839/clipboard03xp.jpg
3. Thats the look…very Arial:
http://img7.imageshack.us/img7/2550/clipboard02qo.jpg
any ideas?
@mateus could you please give it a try in Opera to see if we have the same problem there? I think the problem is in Helvetica names. The CSS tries the following fonts: ‘Helvetica Neue’, Helvetica, Arial, sans-serif. The problem might be that your fonts are named ‘Helvetica LT …” and “Helvetica Neue CE …”. Do you have any experience with basic html+css to test how does your system work with these fonts? (i.e. to try how they need to be named in css to be used).
The problem with logo will require some adjustments to Helvetimal.css from my side
there’s another solution which I would strongly recommend: get a Mac ;-D
Hi Josef again,
first of all – thanks, but no mac here
i managed to edit the javascript plugin and to get to your helvetimail.css. i changed the helvetica names according to the ones installed here (to be sure I put some “serif” behind it, in case the helvetica is not recognized i should see Serif?!). But here’s the result: http://img190.imageshack.us/i/clipboard01ky.jpg/
And sorry…no opera here. If there’s no other clues I will have to install it to test.
sorry for the inconvenience,
Mateus
Hi Josef – thanks very much for sharing this. It looks great!
I was wondering if you’ll be keeping up with changes to Gmail, and whether that just means changes to the CSS file imported into the script – ie, no changes required in the actual script?
Cheers
Paul
@Josef Richter
No italics on the minimalist theme, only on Helvetimail:
italics:[IMG]http://i31.tinypic.com/5vw4ts.jpg[/IMG]
minimalist: [IMG]http://i25.tinypic.com/2nr1noz.jpg[/IMG]
Hi, very awesome theme!

It’s working, but I find out the mouse-over effect in the drop-down menu of “Move to” or “Labels” is missing.
(Maybe it’s because the mouse-over color is modified to white color?)
anybody get this working in chrome 3 (stable build)?
@phoenix will have a look at it. thanks
@mateus Please note that if you want to use other than web-safe font in CSS, its name must be in quotes. so you should use font-family: ‘Helvetica LT 65 Medium’, Arial, sans-serif !important;
I’ve made you a short testcode – could you please download it to test your Helveticas http://snippie.net/snip/c8541416 with this file you can try which font name works on your system. maybe ‘Helvetica Neue CE’ or ‘Helvetica LT’ without specifying the weight could be sufficient. don’t know for sure, give it a try please.
@paul I will try to keep up with changes in Gmail. and yes, most of the changes should require only css adjustments – so if you have the script version with linked css (firefox, opera) you should see the changes immediately once I upload them.
SAFARI USERS: the css is included in the userscript – so for any changes to take effect, you need to download newer version of the userscript. check back early, check back often
@kristian could you send a screenshot please? what version of safari are you using on what platform, please?
@jorge I see. could you please check your fonts folder to see which Helvetica you have installed? It looks like some font and weight mismatch. also could you please try this test code to see if it is the case http://snippie.net/snip/c8541416 thank you
But What about IE? Can’t i use this with IE?
@Håvard IE is a subprime browser and it won’t handle Helvetimail correctly. please do not use Internet Explorer unless you are absolutely forced to (e.g. company computer). I can recommend firefox, safari, chrome or opera.
The camera chat icons (displayed if the user has enabled Google’s video chat) seem to have been overlooked… don’t know if this has been discussed before, thought I’d mention.
this theme is sweet!
kudos for porting helevitcareader!
1) the camera gchat icons don’t work for me either
2) it seems when previewing attached docs under “preview as html”, most of the document at the bottom gets cut off.
Using Firefox.
Anyone else notice that, when you start typing an email address in the To field, there is no highlight when moving over each email address? At least there doesn’t seem to be an easily distinguishable one.
Never mind about my last comment. I change “.ah .ac-active” to the following, and I’m happy with that.
.ah .ac-active {
background-color:#FFFFFF;
color:#a00;
}
beautiful but in firefox i still have the logo ‘gmail’ instead of the logo ‘helvetimail’
Thanks for this skin Josef. However, the Chat window does not appear properly like it does on regular Gmail. Can’t click on Videos & More at the bottom.
awesome! many thanks!
what about about a helvidocs?
I don’t have an Inbox link on the side, even though I can still click on the empty space to get to my inbox… and also, my buttons have no rounded corners.
fixed now, hopefully
Same here, no Inbox link, also no scrollbars on text input boxes. Also, no replies to my comments here on the blog.
I’m using Mailplane. Has the .css file been updated, or just the userscript?
just css, andrew. just did some more fixes, so maybe try to reload again, please
sorry, difficult to follow up on all comments. inbox link fixed now. will have a look at scrollbars. thanks
On Chrome 5.0.375 (not a nightly build) for Windows I install the Opera script and IT WORK’S !!!
Thanks and sorry for my horrible English.