Default settings

Episerver comes with a preconfigured TinyMCE editor that renders all XHTML properties by default.

The default configuration for TinyMCE uses the constants defined on the EPiServer.Cms.TinyMce.Core.DefaultValues class . For information about plugins, see Episerver TinyMCE plugins.

The DefaultValues.EpiserverPlugins constant defines the default Episerver plugins:

"epi-link epi-image-editor epi-dnd-processor epi-personalized-content"

Note: The epi-dnd-processor is a required plugin to drag and drop Episerver content.

The DefaultValues.TinyMcePlugins constant defines the default TinyMCE plugins:

"help image fullscreen lists searchreplace"

The DefaultValues.Toolbar constant defines the default toolbar configuration:

"formatselect | bold italic | epi-link image epi-image-editor epi-personalized-content 
    | bullist numlist outdent indent | searchreplace fullscreen | help"

Overriding the defaults

To override the default settings, add a new initialization module with a dependency on the default one.

The TinyMceSettings class provides helper methods for setting the most common settings within TinyMCE, which map to the configuration settings documented on TinyMCE's website: https://www.tinymce.com/docs/configure/.

However, you can configure settings that do not have a helper method by using the AddSetting or RawSettings methods.

[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.Default()
                .BodyClass("custom_body_class")
                .ContentCss("/static/css/editor.css")
                .AddSetting("directionality", "rtl");
        });
    }
}

When overriding the defaults, you should call the AddEpiserverSupport method to get the basic EPiServer plugins and styling configured.

[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.Default()
                .AddEpiServerSupport()
                .Toolbar("custom toolbar items");
        });
    }
}

Default settings

Overriding the defaults

Related topics

Blog posts