From e04c3271d2cfa60e5d22fbb55f1f329173a20133 Mon Sep 17 00:00:00 2001 From: Filip Sobol Date: Mon, 16 Sep 2024 13:43:04 +0200 Subject: [PATCH 1/4] Docs: Add information about the UMD builds to NIM migration guides. [short flow] --- .../migration-to-new-installation-methods.md | 28 + docs/updating/nim-migration/online-builder.md | 2 +- .../nim-migration/predefined-builds.md | 1052 ++++++++++++++++- 3 files changed, 1075 insertions(+), 7 deletions(-) diff --git a/docs/updating/nim-migration/migration-to-new-installation-methods.md b/docs/updating/nim-migration/migration-to-new-installation-methods.md index e8af2c33f2b..bdf9b9663e7 100644 --- a/docs/updating/nim-migration/migration-to-new-installation-methods.md +++ b/docs/updating/nim-migration/migration-to-new-installation-methods.md @@ -169,6 +169,34 @@ ClassicEditor ``` +In some environments, you may not be able to use the import maps or JavaScript modules. In such cases, you can instead use the UMD builds, which register global variables that you can use in your scripts. This is the same setup as above, but using the UMD builds: + +```html + + + + + + + + + + + + + +``` + ### What's new? There are a few things that stand out in both examples compared to the old installation methods: diff --git a/docs/updating/nim-migration/online-builder.md b/docs/updating/nim-migration/online-builder.md index 66c1759e3f2..1b77dbf152f 100644 --- a/docs/updating/nim-migration/online-builder.md +++ b/docs/updating/nim-migration/online-builder.md @@ -21,7 +21,7 @@ The CDN build is a good option to quickly add CKEditor 5 to your website wi ## ZIP archive -If you do not want to have a build process or use our CDN build, you can download the ZIP archive from the [CKEditor 5 download page](https://ckeditor.com/ckeditor-5/download/#zip). This archive contains the editor build with all its plugins, which you can extract and include on your website. +If you do not want to have a build process or use our CDN build, you can download the ZIP archive with the editor build. We recommend using our new interactive [Builder](https://ckeditor.com/ckeditor-5/builder/?redirect=docs) to customize the build to your needs. Then, in the `Installation` section of the Builder, you can select the `Self-hosted (ZIP)` option to learn how to add the editor to your website. ## npm package diff --git a/docs/updating/nim-migration/predefined-builds.md b/docs/updating/nim-migration/predefined-builds.md index 82e00b08882..3f75f00ce77 100644 --- a/docs/updating/nim-migration/predefined-builds.md +++ b/docs/updating/nim-migration/predefined-builds.md @@ -775,9 +775,11 @@ If you are using predefined builds from npm, follow the steps below: ### CDN -If you are using the predefined builds from CDN, follow the steps below. +If you are using the predefined builds from CDN, follow the steps below depending on if you want to use the JavaScript modules (ESM) with imports or the standard (UMD) scripts with global variables. -One notable difference between the old and new CDN builds is that the former uses the ` + ``` + +2. Add the `` and ` + ``` + + 2.2 If you also use premium features from our commercial offer: + + ```html + + + + + ``` + +3. Replace the old ` + ``` + + After: + ```html + + ``` + + +
+ Inline editor + + Before: + ```html + + ``` + + After: + ```html + + ``` +
+ +
+ Balloon editor + + Before: + ```html + + ``` + + After: + ```html + + ``` +
+ +
+ Balloon block editor + + Before: + ```html + + ``` + + After: + ```html + + ``` +
+ +
+ Decoupled document editor + + Before: + ```html + + ``` + + After: + ```html + + ``` +
+ +
+ Multi-root editor + + Before: + ```html + + ``` + + After: + ```html + + ``` +
+ +
+ Superbuild + + + Please note that the snippet below does not include plugins for the {@link features/math-equations math equations and chemical formulas} and {@link features/spelling-and-grammar-checking spelling, grammar, and punctuation checking} features which were part of the old superbuild. + + Please [contact us](https://ckeditor.com/contact/) if you require these features in the CDN distribution. + + + Before: + ```html + + ``` + + After: + ```html + + ``` +
+ +4. Unlike when using predefined builds, you are now free to customize the editor by adding or removing plugins. However, before you do this, you should test the editor to make sure it works as expected. From e9d6a55215c8a210103e3c7ed3d47c0021e1e681 Mon Sep 17 00:00:00 2001 From: Bartek Date: Mon, 16 Sep 2024 14:02:17 +0200 Subject: [PATCH 2/4] Docs: minor fixes. [short flow] --- .../nim-migration/migration-to-new-installation-methods.md | 2 +- docs/updating/nim-migration/online-builder.md | 2 +- docs/updating/nim-migration/predefined-builds.md | 4 ++-- 3 files changed, 4 insertions(+), 4 deletions(-) diff --git a/docs/updating/nim-migration/migration-to-new-installation-methods.md b/docs/updating/nim-migration/migration-to-new-installation-methods.md index bdf9b9663e7..40e6347b0cf 100644 --- a/docs/updating/nim-migration/migration-to-new-installation-methods.md +++ b/docs/updating/nim-migration/migration-to-new-installation-methods.md @@ -169,7 +169,7 @@ ClassicEditor ``` -In some environments, you may not be able to use the import maps or JavaScript modules. In such cases, you can instead use the UMD builds, which register global variables that you can use in your scripts. This is the same setup as above, but using the UMD builds: +In some environments, you may not be able to use the import maps or JavaScript modules. In such cases, you can use the UMD builds instead. These register global variables that you can use in your scripts. This is the same setup as above, but using the UMD builds: ```html diff --git a/docs/updating/nim-migration/online-builder.md b/docs/updating/nim-migration/online-builder.md index 1b77dbf152f..5e2a50b2459 100644 --- a/docs/updating/nim-migration/online-builder.md +++ b/docs/updating/nim-migration/online-builder.md @@ -21,7 +21,7 @@ The CDN build is a good option to quickly add CKEditor 5 to your website wi ## ZIP archive -If you do not want to have a build process or use our CDN build, you can download the ZIP archive with the editor build. We recommend using our new interactive [Builder](https://ckeditor.com/ckeditor-5/builder/?redirect=docs) to customize the build to your needs. Then, in the `Installation` section of the Builder, you can select the `Self-hosted (ZIP)` option to learn how to add the editor to your website. +If you do not want to have a build process or use our CDN build, you can download a ZIP archive with the editor build. We recommend using our new interactive [Builder](https://ckeditor.com/ckeditor-5/builder/?redirect=docs) to customize the build to your needs. Then, in the `Installation` section of the Builder, you can select the `Self-hosted (ZIP)` option to learn how to add the editor to your website. ## npm package diff --git a/docs/updating/nim-migration/predefined-builds.md b/docs/updating/nim-migration/predefined-builds.md index 3f75f00ce77..2d20972719f 100644 --- a/docs/updating/nim-migration/predefined-builds.md +++ b/docs/updating/nim-migration/predefined-builds.md @@ -775,7 +775,7 @@ If you are using predefined builds from npm, follow the steps below: ### CDN -If you are using the predefined builds from CDN, follow the steps below depending on if you want to use the JavaScript modules (ESM) with imports or the standard (UMD) scripts with global variables. +If you are using the predefined builds from CDN, follow the steps below depending on iwhether you want to use JavaScript modules (ESM) with imports or standard (UMD) scripts with global variables. #### CDN with imports @@ -1847,7 +1847,7 @@ One notable difference between the old build and the new ESM build is that the f 2. Add the `` and `