ckeditor.com Open in urlscan Pro
2600:9000:26e8:ea00:8:1a6d:5f00:93a1  Public Scan

Submitted URL: https://sm-lt-v3n.netcorecloud.net/vtrack?clientid=107311&ul=AlQGA1dXBk0HTglNWQQcA1FaVAdAECURWVtbQA1dBw8SWx5UC15ODh8IBh0GC15SV0AQIk...
Effective URL: https://ckeditor.com/docs/ckeditor5/latest/getting-started/index.html
Submission: On January 09 via api from US — Scanned from DE

Form analysis 0 forms found in the DOM

Text Content

CKEditor Ecosystem Documentation

 * CKEditor 5
 * Getting started
 * Features
 * Examples
 * Framework
 * API
 * Updating
 * Support
 * 

 * CKEditor 5
   * Getting started
     * Quick start
     * Installation
       * Cloud (CDN)
         * Vanilla JS
         * Angular
         * React
           * Default integration
           * Multi-root integration
         * Next.js
         * Vue.js 2.x
         * Vue.js 3+
         * Laravel
         * .NET
       * Self-hosted (npm/ZIP)
         * Vanilla JS
         * Angular
         * React
           * Default integration
           * Multi-root integration
         * Next.js
         * Vue.js 2.x
         * Vue.js 3+
         * Laravel
         * .NET
       * CSS frameworks
       * Drupal
     * Setup
       * Getting and setting data
       * Editor lifecycle
       * Editor types
       * Configuring features
       * Editor toolbars
       * Menu bar
       * UI language
       * Editor and content styles
       * TypeScript supportNew
       * Content Security Policy (CSP)
       * Optimizing build size
       * Loading CDN resourcesNew
     * Licensing
       * License key and activationNew
       * Usage-based billingNew
       * Editor licenseNew
       * Whitelabelling the editor
     * Legacy installation methods
       * Imports in the legacy setup
       * Basics
         * (Legacy) Quick start
         * (Legacy) Predefined builds
         * (Legacy) Customized installation
         * (Legacy) API and events
         * (Legacy) Extending features
       * Advanced concepts
         * (Legacy) Using two different editors
         * (Legacy) Content styles
         * Alternative setups
           * (Legacy) Integrating from source using webpack
           * (Legacy) Integrating from source using Vite
           * (Legacy) DLL builds
           * (Legacy) DLL builds for Collaboration Features
       * (Legacy) TypeScript support
       * Integrations
         * (Legacy) Angular
         * (Legacy) React
         * (Legacy) Vue.js 2.x
         * (Legacy) Vue.js 3+
   * Features
   * Examples
   * Framework
   * API
   * Updating
   * Support
 * CKEditor 4
 * Letters
 * Cloud Services
 * CKBox
 * CKFinder
 * CKEditor Premium Features free trial

Home/CKEditor 5/Getting started


GETTING STARTED WITH CKEDITOR 5


TABLE OF CONTENTS

 1. Are you new to CKEditor 5?
 2. CKEditor 5 framework integrations
    1. Support for other frameworks
 3. Migrating from CKEditor 4?
 4. Configuring CKEditor 5
 5. Legacy installation methods

CKEditor 5 is a flexible editing framework that provides every type of WYSIWYG
editing solution imaginable. From editors similar to Google Docs and Medium to
Notion, Slack, or Twitter-like applications, all is possible within a single
editing framework. It is a modern JavaScript rich-text editor with MVC
architecture, custom data model, and virtual DOM, written from scratch in
TypeScript with excellent support for modern bundlers. Find out the most
convenient way to start using it!


CKEDITOR 5 BUILDER

In our interactive Builder you can quickly get a taste of CKEditor 5. It offers
an easy-to-use user interface to help you configure, preview, and download the
editor suited to your needs. You can easily select:

 * The editor type.
 * The features you need.
 * Preferred framework (React, Angular, Vue or Vanilla JS).
 * Preferred distribution method.

At the end you get ready-to-use code tailored to your needs!

Check out our interactive Builder


# ARE YOU NEW TO CKEDITOR 5?

If your dive into using our WYSIWYG editor is only starting, find out how to
kick off this adventure easily. You have a few methods to choose from:

 * Using CKEditor 5 Builder for the smoothest setup with live preview and
   multiple integration options.
 * Using npm, where you use a JavaScript package and build the editor with a
   bundler.
 * Using CDN, where you use our cloud-distributed CDN in a no-build setup.
 * Using a ZIP file, where you download the ready-to-run files and copy them to
   your project.
 * Choosing one of the pre-made integrations with popular frameworks.


# CKEDITOR 5 FRAMEWORK INTEGRATIONS

Do you want to use a framework? Native integrations with the most popular
libraries will save you time and effort. There are five official integrations so
far:

 * Integrate CKEditor 5 with Angular using CDN or npm.
 * Integrate CKEditor 5 with React using CDN or npm.
 * Integrate CKEditor 5 with Next.js using CDN or npm.
 * Integrate CKEditor 5 with Vue.js 3.x using CDN or npm.
 * Integrate CKEditor 5 with Vue.js 2.x using npm.

However, integration steps for some more frameworks are also documented. Refer
to their documentation on the left to learn how to use them.


# SUPPORT FOR OTHER FRAMEWORKS

CKEditor 5 is a native JavaScript rich-text editing component written in
TypeScript. As such, it is framework-agnostic and can be integrated with any
JavaScript framework and application. It does not require any uncommon
techniques or technologies to be used. Therefore, unless the framework you use
has atypical limitations, CKEditor 5 is compatible with it.

CKEditor 5 is also compatible with popular CSS frameworks such as Bootstrap or
Foundation. Such integrations, however, often require additional changes and
adjustments that we have gathered in this guide.

We plan to provide more integrations with time. We would like to hear your ideas
about what we should work on next.


# MIGRATING FROM CKEDITOR 4?

If you are familiar with our previous, discontinued product and would like to
switch, check the Migration section. You will find a useful upgrade guide there
to help you switch with the least effort.


# CONFIGURING CKEDITOR 5

Once you install your copy of CKEditor 5, take some time to configure it before
first use. Set up data-saving methods, editor toolbars, and UI.

You may also take the step-by-step tutorial that will guide you through the
installation and configuration of the editor.


# LEGACY INSTALLATION METHODS

Before version 42.0.0, CKEditor 5 used different installation methods. If, for
whatever reason, you wish to use these older versions – while it is not advised
– you can have a look at the legacy installation guides. Otherwise, please see
the Migrating CKEditor 5 to new installation methods guide.

 * Quick start
 * Installation
   * Cloud (CDN)
     * Vanilla JS
     * Angular
     * React
       * Default integration
       * Multi-root integration
     * Next.js
     * Vue.js 2.x
     * Vue.js 3+
     * Laravel
     * .NET
   * Self-hosted (npm/ZIP)
     * Vanilla JS
     * Angular
     * React
       * Default integration
       * Multi-root integration
     * Next.js
     * Vue.js 2.x
     * Vue.js 3+
     * Laravel
     * .NET
   * CSS frameworks
   * Drupal
 * Setup
   * Getting and setting data
   * Editor lifecycle
   * Editor types
   * Configuring features
   * Editor toolbars
   * Menu bar
   * UI language
   * Editor and content styles
   * TypeScript supportNew
   * Content Security Policy (CSP)
   * Optimizing build size
   * Loading CDN resourcesNew
 * Licensing
   * License key and activationNew
   * Usage-based billingNew
   * Editor licenseNew
   * Whitelabelling the editor
 * Legacy installation methods
   * Imports in the legacy setup
   * Basics
     * (Legacy) Quick start
     * (Legacy) Predefined builds
     * (Legacy) Customized installation
     * (Legacy) API and events
     * (Legacy) Extending features
   * Advanced concepts
     * (Legacy) Using two different editors
     * (Legacy) Content styles
     * Alternative setups
       * (Legacy) Integrating from source using webpack
       * (Legacy) Integrating from source using Vite
       * (Legacy) DLL builds
       * (Legacy) DLL builds for Collaboration Features
   * (Legacy) TypeScript support
   * Integrations
     * (Legacy) Angular
     * (Legacy) React
     * (Legacy) Vue.js 2.x
     * (Legacy) Vue.js 3+

© 2003-2025 CKSource. All rights reserved.

About cookies on this site

We use cookies to collect and analyse information on site performance and usage,
to provide social media features and to enhance and customise content and
advertisements.

Learn more

Cookie settingsAllow all cookies

About cookies on this site

❮
❯
 * Categories
 * Cookie declaration

Cookies used on the site are categorized and below you can read about each
category and allow or deny some or all of them. When categories than have been
previously allowed are disabled, all cookies assigned to that category will be
removed from your browser. Additionally you can see a list of cookies assigned
to each category and detailed information in the cookie declaration.

Learn more

Deny allAllow all cookies


Necessary cookies

Some cookies are required to provide core functionality. The website won't
function properly without these cookies and they are enabled by default and
cannot be disabled.

CookieHub

CookieHub is a Consent Management Platform (CMP) which allows users to control
storage and processing of personal information.

 * Privacy Policy

 * cookiehub

Cloudflare

Cloudflare is a global network designed to make everything you connect to the
Internet secure, private, fast, and reliable.

 * __cfruid
 * __cf_bm
 * __cf_bm



Preferences

Preference cookies enables the web site to remember information to customize how
the web site looks or behaves for each user. This may include storing selected
currency, region, language or color theme.



Analytical cookies

Analytical cookies help us improve our website by collecting and reporting
information on its usage.

Google Analytics

Google Analytics is a web analytics service offered by Google that tracks and
reports website traffic.

 * Privacy Policy

 * _ga_*
 * _ga
 * test_cookie

Hotjar

Hotjar is a product experience insights platform that gives you behavior
analytics and feedback data to help you empathize with and understand your
customers.

 * _hjSessionUser_*
 * _hjSession_*

Microsoft Clarity

Clarity is a user behavior analytics tool that helps you understand how users
interact with your website.

 * Privacy Policy

 * CLID
 * _clck
 * SM
 * MR
 * _clsk
 * MR
 * ANONCHK



Marketing cookies

Marketing cookies are used to track visitors across websites to allow publishers
to display relevant and engaging advertisements. By enabling marketing cookies,
you grant permission for personalized advertising across various platforms.

Google Ads

Google Ads is an advertising service by Google for businesses that want to
display ads on Google search results and its advertising network.

 * Privacy Policy

 * _gcl_au
 * IDE
 * test_cookie

YouTube

YouTube is a free video sharing website that makes it easy to watch online
videos.

 * Privacy Policy

 * YSC
 * VISITOR_INFO1_LIVE
 * VISITOR_PRIVACY_METADATA

Microsoft Ads

Microsoft Advertising (formerly Bing Ads) is a service that provides pay per
click advertising on the Bing, Yahoo!, and DuckDuckGo search engines.

 * Privacy Policy

 * MUID
 * MUID
 * SRM_B
 * MSPTC
 * ANONCHK
 * _uetsid
 * _uetvid

Visual Website Optimizer

 * _vwo_uuid_v2



Other cookies

The cookies in this category have not yet been categorized and the purpose may
be unknown at this time.

Cookies used on the site are categorized and below you can read about each
category and allow or deny some or all of them. When categories than have been
previously allowed are disabled, all cookies assigned to that category will be
removed from your browser. Additionally you can see a list of cookies assigned
to each category and detailed information in the cookie declaration.

Learn more

Necessary cookies

Some cookies are required to provide core functionality. The website won't
function properly without these cookies and they are enabled by default and
cannot be disabled.

Necessary cookiesNameHostnameVendorExpiryurl-tracker.ckeditor.com400
days_vwo_uuid_v2.ckeditor.comVisual Website Optimizer366 days

Calculates Unique Traffic On a website

__cfruid.calendly.comCloudflare, Inc.Session

This cookie is set by Cloudflare for rate limiting policies.

utm-touches.ckeditor.com7 dayscookiehub.ckeditor.comCookieHub365 days

Used by CookieHub to store information about whether visitors have given or
declined the use of cookie categories used on the site.

_cfuvid.calendly.comSession

Used by Cloudflare WAF to distinguish individual users who share the same IP
address and apply rate limits

__cf_bm.g2crowd.comCloudflare, Inc.1 hour

The __cf_bm cookie supports Cloudflare Bot Management by managing incoming
traffic that matches criteria associated with bots. The cookie does not collect
any personal data, and any information collected is subject to one-way
encryption.

_vwo_sn.ckeditor.com1 hour

Stores session-level information. (VWO)

_vis_opt_s.ckeditor.com100 days

The number of times the browser was closed and reopened. Tracks sessions created
for a user. (VWO)

_vis_opt_test_cookie.ckeditor.comSession

Session cookie generated to detect if the cookies are enabled on the browser of
the user or not. It also helps in tracking the number of browser sessions a
visitor has gone through. (VWO)

__cf_bm.calendly.comCloudflare, Inc.1 hour

The __cf_bm cookie supports Cloudflare Bot Management by managing incoming
traffic that matches criteria associated with bots. The cookie does not collect
any personal data, and any information collected is subject to one-way
encryption.

Preferences

Preference cookies enables the web site to remember information to customize how
the web site looks or behaves for each user. This may include storing selected
currency, region, language or color theme.

PreferencesNameHostnameVendorExpiryVISITOR_INFO1_LIVE.youtube.comGoogle180 days

Set by YouTube and used for various purposes, including analytical and
advertising.

VISITOR_PRIVACY_METADATA.youtube.comGoogle180 days

Analytical cookies

Analytical cookies help us improve our website by collecting and reporting
information on its usage.

Analytical cookiesNameHostnameVendorExpiry_ga.ckeditor.comGoogle400 days

Contains a unique identifier used by Google Analytics to determine that two
distinct hits belong to the same user across browsing sessions.

_hjSessionUser_.ckeditor.comHotjar365 days

Hotjar cookie. This cookie is set when the customer first lands on a page with
the Hotjar script. It is used to persist the Hotjar User ID, unique to that site
on the browser. This ensures that behavior in subsequent visits to the same site
will be attributed to the same user ID.

_hjSession_.ckeditor.comHotjar1 hour

Used by Hotjar to hold current session data.

_zitok.ckeditor.com365 daysMUID.bing.comMicrosoft390 days

Microsoft User Identifier tracking cookie used by Bing Ads. It can be set by
embedded microsoft scripts. Widely believed to sync across many different
Microsoft domains, allowing user tracking.

CLIDwww.clarity.msMicrosoft365 days

Identifies the first-time Clarity saw this user on any site using Clarity.

_clck.ckeditor.comMicrosoft365 days

Persists the Clarity User ID and preferences, unique to that site, on the
browser. This ensures that behavior in subsequent visits to the same site will
be attributed to the same user ID.

SM.c.clarity.msMicrosoftSession

This cookie is installed by Clarity. The cookie is used to store non-personally
identifiable information. The cookie is used in synchronizing the MUID
(Microsoft unique user ID) across Microsoft domains.

MUID.clarity.msMicrosoft390 days

Microsoft User Identifier tracking cookie used by Bing Ads. It can be set by
embedded microsoft scripts. Widely believed to sync across many different
Microsoft domains, allowing user tracking.

MR.c.bing.comMicrosoft7 days

Used by Microsoft Clarity to indicate whether to refresh MUID.

_clsk.ckeditor.comMicrosoft1 day

Connects multiple page views by a user into a single Clarity session recording.

MR.c.clarity.msMicrosoft7 days

Used by Microsoft Clarity to indicate whether to refresh MUID.

_vwo_uuid.ckeditor.com365 days, 6 hours

It generates a unique id for every visitor and is used for the report
segmentation feature in VWO, and it also allows you to view data in a more
refined manner. (VWO)

_vwo_ds.ckeditor.com30 days

Stores persistent user-level data for Track (goals, funnels) and Analyze
(heatmaps, recordings, form analytics) (VWO)

Marketing cookies

Marketing cookies are used to track visitors across websites to allow publishers
to display relevant and engaging advertisements. By enabling marketing cookies,
you grant permission for personalized advertising across various platforms.

Marketing cookiesNameHostnameVendorExpiry_gcl_au.ckeditor.comGoogle Advertising
Products90 days

Used by Google AdSense to understand user interaction with the website by
generating analytical data.

_ga_.ckeditor.comGoogle400 days

Contains a unique identifier used by Google Analytics 4 to determine that two
distinct hits belong to the same user across browsing sessions.

YSC.youtube.comGoogleSession

This cookie is set by YouTube video service on pages with YouTube embedded
videos to track views.

IDE.doubleclick.netGoogle Advertising Products390 days

Used by Google's DoubleClick to serve targeted advertisements that are relevant
to users across the web. Targeted advertisements may be displayed to users based
on previous visits to a website. These cookies measure the conversion rate of
ads presented to the user.

SRM_B.c.bing.comMicrosoft390 days

This cookie is installed by Microsoft Bing. Identifies unique web browsers
visiting Microsoft sites.

MSPTC.bing.comMicrosoft390 daysANONCHK.c.clarity.msMicrosoft1 hour

Used to store session ID for a users session to ensure that clicks from adverts
on the Bing search engine are verified for reporting purposes and for
personalisation

_uetsid.ckeditor.comMicrosoft1 day

This cookie is used by Bing to determine what ads should be shown that may be
relevant to the end user perusing the site.

_uetvid.ckeditor.comMicrosoft390 days

Used by Microsoft Advertising to store a unique, anonymized visitor ID to
personalize marketing.

test_cookie.doubleclick.netGoogle1 hour

Used to check if the user's browser supports cookies

Other cookies

The cookies in this category have not yet been categorized and the purpose may
be unknown at this time.

Other cookiesNameHostnameVendorExpiryvisitor_id1018062info.ckeditor.com365
daysvisitor_id1018062-hashinfo.ckeditor.com365 dayslpv1018062info.ckeditor.com1
hourvisitor_id1018062ckeditor.com365 daysvisitor_id1018062-hashckeditor.com365
daysvisitor_id1018062.pardot.com365 daysvisitor_id1018062-hash.pardot.com365
days__Host-CKBox-Authapi.ckbox.io41 days, 17 hoursCKBox-Authapi.ckbox.io41 days,
17
hourscp.contextportal.ckeditor.comSession__Host-next-auth.csrf-tokenportal.ckeditor.comSession__Secure-next-auth.callback-urlportal.ckeditor.comSessionvisitor_id1018062portal.ckeditor.com365
daysvisitor_id1018062-hashportal.ckeditor.com365 days

Save settings
Cookie settings