Example 23 - Menu button example

Configuration that goes into the script tag.

// Creates a new plugin class and a custom listbox
tinymce.create('tinymce.plugins.ExamplePlugin', {
	createControl: function(n, cm) {
		switch (n) {
			case 'mymenubutton':
				var c = cm.createMenuButton('mymenubutton', {
					title : 'My menu button',
					image : 'jscripts/tiny_mce/plugins/example/img/example.gif',
					icons : false
				});

				c.onRenderMenu.add(function(c, m) {
					var sub;

					m.add({title : 'Some item 1', onclick : function() {
						tinyMCE.activeEditor.execCommand('mceInsertContent', false, 'Some item 1');
					}});

					m.add({title : 'Some item 2', onclick : function() {
						tinyMCE.activeEditor.execCommand('mceInsertContent', false, 'Some item 2');
					}});

					sub = m.addMenu({title : 'Some item 3'});

					sub.add({title : 'Some item 3.1', onclick : function() {
						tinyMCE.activeEditor.execCommand('mceInsertContent', false, 'Some item 3.1');
					}});

					sub.add({title : 'Some item 3.2', onclick : function() {
						tinyMCE.activeEditor.execCommand('mceInsertContent', false, 'Some item 3.2');
					}});
				});

				// Return the new menu button instance
				return c;
		}

		return null;
	}
});

// Register plugin with a short name
tinymce.PluginManager.add('example', tinymce.plugins.ExamplePlugin);

// Initialize TinyMCE with the new plugin and menu button
tinyMCE.init({
	plugins : '-example', // - tells TinyMCE to skip the loading of the plugin
	mode : "textareas",
	theme : "advanced",
	theme_advanced_buttons1 : "mymenubutton,bold,italic,underline,separator,strikethrough,justifyleft,justifycenter,justifyright,justifyfull,bullist,numlist,undo,redo,link,unlink",
	theme_advanced_buttons2 : "",
	theme_advanced_buttons3 : "",
	theme_advanced_toolbar_location : "top",
	theme_advanced_toolbar_align : "left",
	theme_advanced_statusbar_location : "bottom"
});

This example shows you how to create a plugin and add a custom menu button. This example creates a simple insert snippet plugin.