November Happy Hour will be moved to Thursday December 5th.
AI OnAI Off
EPiServer CMS 6 - TinyMce adding a TinyMCEPluginButton fails
I think you need a visual for the button.. there are 2 different plugin options for that.. either add iconurl="<url to img>" or iconclass="myclass".
(iconclass if you have a sprite or want to update the current 1 with a new image and use class for background position and icon url for a image url)
Sep 21, 2010 9:15
Also you need to have the buttonname in the script the same as button name in the pluginattribute. This is since when episerver generates the main options for the editor it will add that buttonname when setting up the toolbar. So it needs to be the same as in the javascript plugin for the editor to recorgnize it. Same goes with pluginName
Hope you get it working!
Sep 21, 2010 9:19
Hi.
Yes, your solution for naming the c#-class and javascript plugin the same helped to solve it.
However there are few examples on how to build plugins for TinyMce. Are there any special reason for this ?
Sep 22, 2010 8:02
I think the reason is that EpiServer don't want to handle the educational part of normal tinyMCE development. They want to focus on the EpiServer part. Therefore only have more technical information and not full examples. I was one of the developers working on the new editor in EPiServer (I no longer work for EpiServer though) so I should be able to wip up a decent example.
I will see what I can do =) Ill post the link here later if i get some spare time to do it.
Sep 22, 2010 9:10
Hi.
That sounds cool. If you have some spare time I would be glad (and the community too) if you could
help me in the right direction towards making a style dropdown that changes its content (which css-casses to choose from)
based on the current logged on user. The dropdown should be able to determine who is logged on and populate
the dropdown with different css-classes depending on which groups the user belongs to.
A simple example could be: if user A belongs to group A,B or C then populate the dropdown with css-classes
"simpleheading1", "simpleheading2" and "normal text". if user B belongs to groups D, E or F then
populate the dropdown with css-classes "heading1", "heading2" and "lighttext".
I would be super glad if you have some spare time to give me a tip on this subject.
Sep 22, 2010 13:08
This might be fixable with a nonbuttonplugin or even no plugin at all if you wish (I havent tried this just theoretical thoughts) Since you can set what css file the tinymce should use when geting the styles for the dropdown and content ( http://wiki.moxiecode.com/index.php/TinyMCE:Configuration/content_css "Any CSS classes defined in your CSS file will show up in the styles dropdown lists (unless you explicitly set what shows up in the styles dropdown list with the theme_advanced_styles option)"). and instead of using a normal css you should be able to have a aspx url here that paste cssclasses based on logged in information.
That way by only setting the content_css you should get the functionality you are looking for. It should be just setting that in the admin. but worst case write a nonbuttonplugin with custominitoptions.
If/when I do an wxample I will prob make 1 with a button =)
Sep 23, 2010 12:24
Hi.
Your tip of setting the uiEditorCssPaths to the value of a real aspx-page turned out to be a great idea and solved the problem.
Think more people can benefit from this idea.
Thank you for your great tip.
Edited,
Sep 23, 2010 16:44
This thread is locked and should be used for reference only. Please use the Episerver CMS 7 and earlier versions forum to open new discussions.
Hi.
I am trying to create a plugin to the new TinyMCe editor that exist in EPiServer CMS 6.
I want to be able to display different styles (css-classes) based on which editor(useraccount) that is logged on
and editing a content page.
Certain users (depending on which groups they belong to) should have a limited set of css-classes to choose from.
To solve this I am trying to add a new button to the editor. I get the following runtime error when viewing an xmlstring
property in admin mode.
"url or class must be set for an TinyMce button. Plugin name: mystyleplugin".
c# class for the plugin
[TinyMCEPluginButton(
PlugInName = "mystyleplugin",
ButtonName = "mybuttonstyle",
DisplayName = "my style options",
Url = "/sample.gif",
Description = "Custom editor init options.")]
public class mystyleplugin
{
}
(function() {
tinymce.create('tinymce.plugins.mystylePlugin', {
init : function(ed, url) {
// Register commands
ed.addCommand('mceStyleProps', function() {
ed.windowManager.open({
file : url + '/props.htm',
width : 480 + parseInt(ed.getLang('style.delta_width', 0)),
height : 320 + parseInt(ed.getLang('style.delta_height', 0)),
inline : 1
}, {
plugin_url : '/sample.gif',
style_text : ed.selection.getNode().style.cssText
});
});
ed.addCommand('mceSetElementStyle', function(ui, v) {
if (e = ed.selection.getNode()) {
ed.dom.setAttrib(e, 'style', v);
ed.execCommand('mceRepaint');
}
});
ed.onNodeChange.add(function(ed, cm, n) {
cm.setDisabled('styleprops', n.nodeName === 'BODY');
});
// Register buttons
ed.addButton('styleprops', {title : 'style.desc', cmd : 'mceStyleProps'});
},
getInfo : function() {
return {
longname : 'Style',
author : 'Moxiecode Systems AB',
authorurl : 'http://tinymce.moxiecode.com',
infourl : 'http://wiki.moxiecode.com/index.php/TinyMCE:Plugins/style',
version : tinymce.majorVersion + "." + tinymce.minorVersion
};
}
});
// Register plugin
tinymce.PluginManager.add('mystyle', tinymce.plugins.mystylePlugin);
})();
But at runtime an System.ArgumentException is thrown as described above in this post.
Do anyone have any idea on this subject ?