Subscribe
Sign in
p/npmA package manager for javascript
Start new thread
Mario Rodriguez

MailtoUI.js - Enhance your mailto links with a convenient user interface.

by•

MailtoUI.js is an open source JavaScript library that enhances your mailto links with a convenient user interface. It gives your users the flexibility to compose a new message using a browser-based email client or their default local email app.

Add a comment

Replies

Best
Mario Rodriguez
Maker
Hi everyone! 👋 I'm excited to share MailtoUI with you all. So what is it, you might ask? MailtoUI is a little open source JavaScript library that allows you to easily enhance the way mailto links work on your site. We've all done it at some point. You visit a site. You want to contact someone. You click on the link, only to open the default local email app, which you (most likely) don't use. You then have to close the email app, go back to the site, copy the email address, go to your browser-based email client, compose a new email, and finally paste in the email address. I created MailtoUI with the goal of making mailto links more flexible and provide a better user experience. With MailtoUI users can now opt to compose a new message with one of three popular browser-based email clients (Gmail, Outlook, Yahoo), or their default local email app. MailtoUI is written in vanilla JavaScript. This makes it nice and lean, and has no dependencies. It's super easy to install, highly customizable, and plays well with JavaScript frameworks like Vue.js. The recent soft launch generated lots of positive feedback, so it gave me the confidence to launch it here. I'd like to thank @mijustin's Mega Maker Community and everyone else who have tried it and provided me with valuable feedback. Thank you in advance PH Community, for taking the time to read and checking it out. I hope MailtoUI is useful to you all. And as always, any feedback is much appreciated. Have an awesome day! 🙂
Paul Arterburn
@mariordev Nice work, Mario! Mailto's have always been a pain for me with a mix of personal/work Gmails + Superman. While a Chrome Extension is nice, I think this is a great solution for site owners to implement to give folks with the same issues a clearer path + control over where those clicks are going. Question: given that we have a business app that I'll be using this on, I'm curious if it's possible to hide the Yahoo option? Did I miss that in the docs?
Mario Rodriguez
Maker
@parterburn Thanks so much, Paul! That's not an option at the moment, but I can see how that could be useful. I'll definitely look into it. However, keep in mind that for better or worse, Yahoo is still a widely used email client, so your users may benefit from having that option. Thanks for the suggestion!
Benjamin Roesner
Would be great if i can use an image instead the mailto link, to prevent spam.
Mario Rodriguez
Maker
@ben_roe Unfortunately that's beyond the scope of MailtoUI at the moment. But alternatively, you could use a service like CloudFlare, which provides free automatic email obfuscation for your mailto links, among lots of other features. MailtoUI plays well with CloudFlare's email obfuscation. Hope this helps!
Mohamed aalabou
The solution is very elegant ! @mariordev
Mario Rodriguez
Maker
@mohamedaalabou Thank you so much!
Ricardo Alamino

Is there any plan to translate according to browser language?

Pros:

Great idea!

Cons:

Localization, maybe

William Hu
Is it possible to build a chrome extension, which replaces all the current mailto to mailtoui instead?
Mario Rodriguez
Maker
@williamhutech Hi William, that's something to look into. As a js library, the advantage is that MailtoUI can be added to a website by the developer and it will work everywhere, across all browsers. A Chrome extension would be nice though, to put that control on the user's end. Thanks for the feedback!
Mario Rodriguez
Maker
@ricalamino Thank you for your feedback! That's an interesting idea I honestly hadn't thought about. I'll look into it. Alternatively, at the moment you can customize all text in MailtoUI using the Options feature, if you need to use a different language.
Denis Shershnev
Congratulation on the lunch @mariordev ! Simple and awesome!
Mario Rodriguez
Maker
@eulerr Thanks so much, Denis!
Spidergears

Nothing more nothing less

Pros:

A simple solution to age old problem.

Cons:

Nopes

Sravan Kumar
A simple solution for an annoying problem, congrats! This being a solution across all web pages, I'd imagine this to be applied at consumer end than for the website owners. A browser extension for example.
Mario Rodriguez
Maker
@sravang Thank you, Sravan! Yes, that's something I'd like to look into. Now that MailtoUI is pretty stable, I can look into creating a Chrome extension.
Devin Rajaram
I like how simple this is. Congrats on launching 🎉
Mario Rodriguez
Maker
@devinrajaram Thanks so much, Devin!
Joshua
I just had this idea like a week ago - should've created it
Usman Shahid
This is genius!
Mario Rodriguez
Maker
@usman_shahid1 Thanks so much, Usman!
George Bougakov
Hey, Mario! Congrats on your launch! I already had a similar mechanism on my website and was thinking of converting it to a library (you beat me to it :))
Mario Rodriguez
Maker
@gbougakov Thank you, George! Great minds think alike! 😉
Tony 'LarrikinAussie' Sargeant
G'day MailtoUI Crew, great idea, simple but effective. I'll give it a redhot crack. By the way, so's ya know, my Up-Vote brought you to 666, that's good thing, right ???
Mario Rodriguez
Maker
@larrikinaussie That is a good thing :) Thanks for the upvote!
Miles DePaul
This is very helpfull! @mariordev would this work within an inbox like Gmail?
Mario Rodriguez
Maker
Hi @milesdepaul, If you mean if this works with Gmail, yes it does, Gmail is the first button in the UI. :) Please let me know if this answers your question.
Jamie Raymond
This product is great and is well designed too. However it doesn't seem to be working on mobile screen sizes.
Mario Rodriguez
Maker
@jamie_raymond Hi Jamie, MailtoUI works on mobile as well. However, the option disableOnMobile is set to true by default. You can enable it by setting that option in your script tag. Please take a look at the bottom of the Options table for details: https://mailtoui.com/#options