How to add mailto button in TinyMCE

Question

I need to add the mailto button in TinyMCE in WordPress. Has anyone already done this? Or any peaks on how to do this?

Answer 1

Given that you want to put this into WordPress, I assume that you just want to insert a tag like href = "mailto:" into your document for the current selected text.

The easiest way is to create a basic plugin. You can do this on the same page where tinyMCE is initialized. In the example below, the selected text with static mailto will be migrated.

tinymce.create('tinymce.plugins.MailToPlugin', { init : function(ed, url) { ed.addCommand('mceMailTo', function() { var linkText = ed.selection.getContent({format : 'text'}); var newText = "<a href='mailto: [e-mail] ?subject=testing'>" + linkText + "</a>" ed.execCommand('mceInsertContent', false, newText); }); // Register example button ed.addButton('mailto', { title : 'MailTo', cmd : 'mceMailTo', image : url + '/images/mailto.gif' }); } }); // Register plugin with a short name tinymce.PluginManager.add('mailto', tinymce.plugins.MailToPlugin); 

Of course, you need to create an image (mailto.gif) for the toolbar button.

Then you just add to the list of plugins

 plugins: '-mailto' 

and put mailto on the toolbar.

Of course, if you want the end user to specify an email address and subject, you will need a dialog. There is a good example of how to create a plugin on the TinyMCE website in Creating a Plugin

Unfortunately, I cannot comment on how you will do this in WordPress, but I suspect that you will need to customize the version of the WordPress tinyMCE plugin.

Answer 2

You can use the class that I created in my WordPress tutorial , and then make calls to javascript files by creating an instance of the class. At least regarding the link to add it to your plugins.

Greetings

Answer 3

First of all, make sure you have the tinyMce Advanced plugin installed. Then you can simply use the insert / edit link button in the tinyMce editor. You do not need another button. In the destination URL, add this

 mailto: [e-mail]