Don't miss out Virtual Happy Hour this Friday (April 26).
Try our conversational search powered by Generative AI!
AI OnAI Off
uiEditorCssPaths and defining styles for table classes in table editor
Hi
We have the same issue. We have custom editor.css with custom styles and in CMS 7.0 it worked and only displayed our own styles. Somewhere along the way with the patches of CMS7 I think something got changed. Now we get a lot of EPi styles and our custom ones are added to the bottom of the list.
Oct 17, 2013 16:53
Having the same issue here as well. Can't figure out how to add my own custom classes into the table dropdown for the life of me.
Oct 21, 2013 16:25
Hi,
The change in behavior is likely because of an TinyMCE upgrade. It seems that if the configuration does not contain any entries in the "style_formats" property it will list all css-classes it can find in the content to be edited.
To solve this, use the mapping attributes EditMenuName and EditMenuTitle in your editors css-file to populate the property:
h2 {
EditMenuName: header2;
}
h3 {
EditMenuName: header3;
}
Then you can also give the options a nicer name by adding them to the language file:
<languages>
<language name="English" id="en">
<editorstyleoptions>
<heading2>Heading 2</heading2>
<heading3>Heading 3</heading3>
</editorstyleoptions>
</language>
<languages>
Nov 21, 2013 14:13
Hi Erik,
We have EditMenuName in our CSS. All classes are shown in the dropdown in the insert image dialog, BUT all EPiServer classes as well. The regular global style dropdown shows correct classes though.
Is there a way to hide all EPiServer classes in the image dialog?
Nov 28, 2013 2:46
Hi,
A little debugging of the image dialog revealed that it wants it's classes served in a different configuration property. Solving that is possible albeit not pretty with something like this:
[EditorDescriptorRegistration(TargetType = typeof(XhtmlString), EditorDescriptorBehavior = EditorDescriptorBehavior.PlaceLast)]
public class XhtmlStringEditorDescriptor2 : EditorDescriptor
{
public override void ModifyMetadata(ExtendedMetadata metadata, IEnumerable<Attribute> attributes)
{
var settings = (IDictionary<string, object>)metadata.EditorConfiguration["settings"];
var styleFormats = (IEnumerable<object>)settings["style_formats"];
var classes = new List<string>();
foreach (var styleFormat in styleFormats)
{
var type = styleFormat.GetType();
var propValue = type.GetProperty("classes");
var propKey = type.GetProperty("title");
if (propValue != null)
{
classes.Add(String.Format("{0}={1}", propKey.GetValue(styleFormat, null), propValue.GetValue(styleFormat, null)));
}
}
settings["theme_advanced_styles"] = String.Join(";", classes);
}
}
Nov 28, 2013 12:45
Erik: We are getting defined classes aswell as alot of builtin for the Xhtml table editor classes dropdow. Will youre solution work for that aswell?
Edited,
Nov 28, 2013 12:48
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.
Greetings :)
I am having some trouble removing episerver css classes from parts of tinymce in cms 7 and was wondering if anyone had come across similar issues or had some ideas on how to solve it.
I am attempting to replace the standard styles in the dropdown meny in the table editor of tinymce in EPiServer 7.
After cleaning my Editor.css class of all old styles, epi_dc_preview, epi_pc_content etc. and adding new custom styles the old styles are still present in the drop down list for the table editor but gone from the general "styles" drop down as expected.
If I add more custom table classes they are appended at the bottom below all the "epi_" generated list of classes. This is whlie using the editor in episerver 7 dojo edit mode.
The path to my custom Editor.css file is configured both under <sitesettings> and in the global tiny mce settings.
If I try to edit the page accessing it in the "old ui" "/cms/edit/" the drop down list under table settings just lists the class I created and not all the other epi classes so here it works as one would expect. The "dojo" tinymce editor get loaded from my AppData folder while the "old ui" gets loaded from "Program Files/Episerver/etc".