Five New Optimizely Certifications are Here! Validate your expertise and advance your career with our latest certification exams. Click here to find out more
AI OnAI Off
Five New Optimizely Certifications are Here! Validate your expertise and advance your career with our latest certification exams. Click here to find out more
Hi,
For TinyMCE 4 it would be Episerver's TinyMCE 2 plugin so you need to configure custom styles in an IConfigurableModule like this:
[ModuleDependency(typeof(TinyMceInitialization))]
public class CustomizedTinyMceInitialization : IConfigurableModule
{
public void Initialize(InitializationEngine context)
{
}
public void Uninitialize(InitializationEngine context)
{
}
public void ConfigureContainer(ServiceConfigurationContext context)
{
context.Services.Configure<TinyMceConfiguration>(config =>
{
config.For<StandardPage>(t => t.MainBody)
.Toolbar("styleselect")
.StyleFormats(
new { title = "More button", inline = "span", styles = new { background = "#f00" }, classes = "more-button" }
);
});
}
}
You can find more info here:
https://world.episerver.com/documentation/developer-guides/CMS/add-ons/customizing-the-tinymce-editor-v2/custom-style-formats/
Hi,
You have to extend the TinyMCE plugin and to extend the plugin for whole solution you need to extend the "IConfigurableModule" module.
[InitializableModule]
[ModuleDependency(typeof(TinyMceInitialization))]
public class TinymceCustomInitialization : IConfigurableModule
{
public void ConfigureContainer(ServiceConfigurationContext context)
{
// browser console to see settings: window.tinymce.settings;
context.Services.Configure<TinyMceConfiguration>(config =>
{
config.Default()
.AddPlugin("code", "anchor", "media")
.Toolbar("formatselect | epi-personalized-content epi-link anchor numlist bullist indent outdent bold italic underline alignleft aligncenter alignright | subscript superscript | undo redo | image epi-image-editor media | cut copy pastetext paste removeformat | code | fullscreen")
.AddSetting("valid_children", "+body[style]").AddSetting("extended_valid_elements", "script[language|type|src]");
});
}
public void Initialize(InitializationEngine context) { }
public void Uninitialize(InitializationEngine context) { }
}
@Paul solution is good if you want to extend the TinyMCE for particular field of a page or a block.
Thanks
Ravindra
I have very limited number of controls in tinymce. How to extend or add controls like font color in tiny mce? tinymce version is 4.8.5.