Don't miss out Virtual Happy Hour this Friday (April 26).
Try our conversational search powered by Generative AI!
AI OnAI Off
Don't miss out Virtual Happy Hour this Friday (April 26).
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.