Not sure if this works for the Tiny MCE version in EPiServer (3.5 if you are using EPiServer 7.1+), but have you checked this http://www.tinymce.com/wiki.php/plugin:template ?
Having to complex things in a Editor init module will tend to break because of the JSON parser used. This could be the case when trying to hookup the template plugin but I'm not sure.
We have built a TinyMCE-plugin once to handle something similiar. In our case we showed a dropdown and a button in it's own tool window.
This works for 6 R2 (should work for 7 as well but you'll have to place your plugin dir elsewhere).
Add a plugin definition to project:
namespace Example.Project.Plugins.TinyMCE
{
using EPiServer.Editor.TinyMCE;
[TinyMCEPluginButton(
LanguagePath = "/tinymce/examplebox",
GroupName = "media",
ButtonSortIndex = 21,
ButtonName = "btnExampleBox",
PlugInName = "ExampleBox",
IconUrl = "/Util/Editor/TinyMCE/Plugins/examplebox/i/examplebox.png",
DisplayName = "Informationsruta",
Description = "Infogar en informationsruta"
)]
public class ExampleBox
{
}
}
I've removed the VPP hookup for Util and copied it to a local path below the project and added my plugin directory among the regular ones but for 7 you need to store it elsewhere, haven't looked into the specifics for this (yet).
In your plugin directory (named examplebox if above code is used) you have a editor_plugin.js file where you can do windowManager.open() and open a HTML-file. Could be a dropdown and a button or if no options need to be made you can do stuff directly on the button click from editor_plugin.js.
Typically something like this:
var box = '<div class="some-class"><p>non breaking space</p></div>';
if (n.nodeName == 'P') {
e.dom.setOuterHTML(n, e.dom.getOuterHTML(n) + box);
}
else {
e.selection.setContent(box);
}
Look at this guide, we have followed it and done what you like to do:
http://world.episerver.com/Documentation/Items/Developers-Guide/EPiServer-CMS/75/Editing/Customizing-the-TinyMCE-editor/
Does anyone have any example how you create a snippet for the Tiny MCE editor and then integrate it in the editor. For example I would like to create a snippet that inserts a div with a class named "highlight".
Thanks!