SaaS CMS has officially launched! Learn more now.

Grzegorz Wiecheć
Dec 20, 2022
  6076
(8 votes)

TinyMCE editor upgrade

I’m happy to announce that, after a quite long time, we finally upgraded the TinyMCE editor. The new EPiServer.CMS.TinyMce package contains integration with latest version of the TinyMCE 6 library.

In this release we haven't added new functionalities, but have focused on the library migration.

Configuring editor

We have not changed the way TinyMCE is configured. We are still using TinyMceConfiguration option:

context.Services.Configure<TinyMceConfiguration>(config =>
{
    // Add content CSS to the default settings.
    config.Default()
        .ContentCss("/static/css/editor.css");

    // Limit the block formats for the MainBody property of an ArticlePage.
    config.For<ArticlePage>(t => t.MainBody)
        .BlockFormats("Paragraph=p;Header 1=h1;Header 2=h2;Header 3=h3");
});

There are no new extension methods added for our integration, but there were significant breaking changes in the TinyMCE library. All custom plugins have to be updated. To do that you should follow the migration guide migration from 4x, migration from 5x and how to migrate from tinymce 4 to tinymce 5. Please note that TinyMCE 5 and TinyMCE 6 API are very similar. Version 6 mainly removed obsolete methods.

In the documentation above you can for example find that some plugins are not free anymore (Image tools, Spellchecker, Table of Contents) and some were move to the core package (print, paste, colorpicker, contextmenu, textcolor). Those plugins should be removed from TinyMCE configuration if they were used.

All custom plugins code has to be revisited. There is not jQuery support anymore and there are API changes around registering button, icons, menus, etc. The latest documentation version about creating a custom plugin can be found here.

Built-in TinyMCE spell checker

From EPiServer.CMS.TinyMce 4.0.0, the EPiServer.TinyMCESpellChecker plugin will be included in core page. The EPiServer.TinyMCESpellChecker should be uninstalled since it won't be available as a separate package for EPiServer.CMS.TinyMce 4 and above.

Paste plugin

The standard paste plugin is now part of TinyMCE core package. The paste functionality no longer supports pasting from Word. When pasting from Word, the PowerPaste premium plugin should be used.

Dec 20, 2022

Comments

Praful Jangid
Praful Jangid Dec 22, 2022 01:34 PM

Finally.

Do we have any plan to add all new features as well, in near future?

Robert Svallin
Robert Svallin Jan 4, 2023 01:31 PM

Hey Praful,

Could you please clarify your question a bit. Are you referring to new features from TinyMCE or features in TinyMCE made by Optimizely? When it comes to newer versions of TinyMCE we are currently looking at updating to latest v6 version that is currently available as an update to to the next 4.0.1 TinyMCE package. We expect to deliver more updates with newer versions as they get released by Tiny. If you are looking for specific features that you want built into TinyMCE by Optimizely then I suggest adding them to our feedback site, https://feedback.optimizely.com/ideas/, from which we pull requests into the project.

Did I missunderstand your question, please dont hesitate to clarify.

Praful Jangid
Praful Jangid Jan 4, 2023 02:25 PM

Well, I was talking about the new features list from the TinyMCE (https://www.tiny.cloud/). I have not went through the full list. 

Robert Svallin
Robert Svallin Jan 4, 2023 03:30 PM

Hey again,

As I mentioned we are planning on releasing newer versions of TinyMCE more frequent going forward. Also, you do have the capability to customize what toolbars that are available during startup of the application. Is there something specific that you are looking for?

Please login to comment.
Latest blogs
Optimizely SaaS CMS Concepts and Terminologies

Whether you're a new user of Optimizely CMS or a veteran who have been through the evolution of it, the SaaS CMS is bringing some new concepts and...

Patrick Lam | Jul 15, 2024

How to have a link plugin with extra link id attribute in TinyMce

Introduce Optimizely CMS Editing is using TinyMce for editing rich-text content. We need to use this control a lot in CMS site for kind of WYSWYG...

Binh Nguyen Thi | Jul 13, 2024

Create your first demo site with Optimizely SaaS/Visual Builder

Hello everyone, We are very excited about the launch of our SaaS CMS and the new Visual Builder that comes with it. Since it is the first time you'...

Patrick Lam | Jul 11, 2024

Integrate a CMP workflow step with CMS

As you might know Optimizely has an integration where you can create and edit pages in the CMS directly from the CMP. One of the benefits of this i...

Marcus Hoffmann | Jul 10, 2024