Migrate from TinyMCE or CKEditor — in under a day.

Why teams move

• Perpetual license vs CKEditor’s subscription + add-on SKUs (Track Changes, Comments, Revision History, AI, Real-time Collab are each separate paid modules).
• Simpler integration — one NuGet, one Tag Helper, done. CKEditor 5 requires webpack / Vite config and custom-build headaches to mix features.
• Better .NET story — idiomatic ASP.NET Core, MVC, Web Forms, Blazor, and Classic ASP. CKEditor is React/Vue/Angular only.
• Self-host on entry tier. CKEditor’s enterprise features require custom contract pricing.

Step-by-step checklist

1. Install the NuGet: dotnet add package RichTextBox.AspNetCore --version 1.0.0-preview.12
2. Register in Program.cs: builder.Services.AddRichTextBox(); · app.MapRichTextBoxUploads();
3. Drop RichTextBox.lic next to Program.cs.
4. Remove your CKEditor custom build / webpack config — we don’t need one.
5. Replace ClassicEditor.create(...) init code with a single <richtextbox> tag.
6. Map your CKEditor toolbar: [ ... ] items to our toolbar attribute (see cheat sheet).
7. Collaboration: replace CKEditor Cloud Services + Yjs plugins with our enable-collab="true" and load Yjs from npm or a CDN.
8. Paste existing CKEditor content directly — HTML output is compatible.

Config cheat sheet

Basic setup

import ClassicEditor from '@ckeditor/ckeditor5-build-classic';

ClassicEditor.create(document.querySelector('#editor'), {
  toolbar: {
    items: ['bold', 'italic', '|',
            'bulletedList', 'numberedList', '|',
            'link', 'imageUpload']
  }
});

<richtextbox
    asp-for="Body"
    toolbar="custom" />

<script>
RTE_DefaultConfig.toolbar_custom =
  "{bold,italic}|{insertunorderedlist,insertorderedlist}|{insertlink,insertimage}";
</script>

Real-time collaboration

ClassicEditor.create(el, {
  cloudServices: {
    tokenUrl: '/api/ckeditor-token',
    webSocketUrl: 'wss://cs.cke-cs.com/...'
  },
  collaboration: {
    channelId: documentId
  }
});

<richtextbox asp-for="Body"
    enable-collab="true"
    current-user-id="@User.Id"
    current-user-name="@User.Name" />

<script type="module">
import * as Y from "https://esm.sh/yjs";
import { WebsocketProvider } from "https://esm.sh/y-websocket";
const ydoc = new Y.Doc();
const p = new WebsocketProvider(
    "wss://your-server/yjs", docId, ydoc);
editor.collab.attach({
    doc: ydoc, provider: p,
    textSync: true  // concurrent typing
});
</script>

AI Assistant → AI Toolkit

ClassicEditor.create(el, {
  ai: {
    openAI: {
      requestHeaders: {
        Authorization: 'Bearer ...'
      },
      apiUrl: 'https://api.openai.com/v1/...'
    }
  }
});

builder.Services.AddRichTextBox();
builder.Services.AddRichTextBoxOpenAiResolver(opts =>
{
    opts.ApiKey = builder.Configuration["OpenAI:ApiKey"];
    opts.Model  = "gpt-4o-mini";
});

Plugin equivalence

Behavior differences to know about

What you gain

• Native ASP.NET Core Tag Helper — no JS wrapper, no webpack, no custom build.
• Perpetual license vs five separate subscription SKUs (Collab, Comments, Track, Revision, AI).
• Self-host everything, day one — including Yjs collab (your choice of WebSocket / WebRTC / Hocuspocus provider).
• Dictation plugin, mobile toolbar mode, and public release notes out of the box.
• Blazor Server, Web Forms, Classic ASP, PHP bindings.

Why teams move

• Lower cost. Froala’s commercial license is per-project. We’re $129 once for a perpetual domain license that includes Track Changes, Comments, Revision History, and the AI Toolkit — features Froala either lacks or charges extra for.
• Wider feature set. Froala doesn’t ship Track Changes or Threaded Comments at all; our v2.0 stack includes both in the base license.
• First-class .NET integration. Froala has React/Vue/Angular wrappers but no idiomatic ASP.NET Core Tag Helper. We’re a one-line <richtextbox> tag.
• BYOK AI without a proxy. Froala’s AI Assist plugin requires routing through your backend; our resolver pattern is one-line DI registration.

Step-by-step checklist

1. Install the NuGet: dotnet add package RichTextBox.AspNetCore --version 1.0.0-preview.13
2. Register in Program.cs: builder.Services.AddRichTextBox(); · app.MapRichTextBoxUploads();
3. Drop RichTextBox.lic next to Program.cs.
4. Replace new FroalaEditor('#editor', { ... }) with the <richtextbox asp-for="Body" toolbar="full" /> Tag Helper.
5. Map your Froala toolbarButtons to our toolbar attribute — see cheat sheet below.
6. If you use Froala AI Assist, register an IRichTextBoxAiResolver: builder.Services.AddRichTextBoxOpenAiResolver(opts => ...).
7. Replace any custom event listeners with editor.attachEvent("change", fn) equivalents.
8. Existing HTML keeps working; submit forms as normal.

Config cheat sheet

Basic setup

new FroalaEditor('#editor', {
  toolbarButtons: [
    'bold', 'italic', 'underline', '|',
    'formatOL', 'formatUL', '|',
    'insertLink', 'insertImage'
  ],
  height: 500
});

<richtextbox
    asp-for="Body"
    toolbar="custom"
    height="500px" />

<script>
RTE_DefaultConfig.toolbar_custom =
  "{bold,italic,underline}|{insertorderedlist,insertunorderedlist}"
  + "|{insertlink,insertimage}";
</script>

AI (Froala AI Assist → RichTextBox AI Toolkit)

FroalaEditor.DefineIcon('aiAssist',
  { NAME: 'magic', SVG_KEY: 'magicWand' });
FroalaEditor.RegisterCommand('aiAssist', {
  callback: function () {
    fetch('/my-proxy', { ... })
      .then(/* manual integration */);
  }
});

builder.Services.AddRichTextBox();
builder.Services.AddRichTextBoxOpenAiResolver(opts =>
{
    opts.ApiKey = builder.Configuration["OpenAI:ApiKey"];
    opts.Model  = "gpt-4o-mini";
});

@* Page *@
<richtextbox asp-for="Body"
             enable-ai-toolkit="true" />

Image upload (custom upload URL)

new FroalaEditor('#editor', {
  imageUploadURL: '/api/upload-image',
  imageUploadParam: 'file'
});

// Program.cs maps /richtextbox/upload automatically:
app.MapRichTextBoxUploads();

// Want to send images to S3 / Azure / Cloudinary instead?
// Implement IRichTextBoxUploadStore — see /UploadProviders.

Plugin equivalence

Behavior differences to know about

What you gain

• Track Changes + Comments + Revision History — Froala doesn’t ship any of these.
• Slash commands & @mentions — Notion-style inline picker; Froala has no equivalent.
• Yjs real-time presence + concurrent typing preview.
• Dictation (Web Speech API microphone button).
• ASP.NET Core Tag Helper, Blazor, Web Forms, Classic ASP, PHP bindings.
• Pluggable cloud upload providers (S3, Azure Blob, Cloudinary, GCS) via one DI registration.
• Perpetual one-time license at $129 vs Froala’s per-project commercial pricing.