Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Docs: Add information about the UMD builds to NIM migration guides. #17100

Merged
merged 4 commits into from
Sep 16, 2024
Merged

Docs: Add information about the UMD builds to NIM migration guides. #17100

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
e04c327
Docs: Add information about the UMD builds to NIM migration guides. […
filipsobol Sep 16, 2024
e9d6a55
Docs: minor fixes. [short flow]
godai78 Sep 16, 2024
f700c4a
Apply suggestions from code review [short flow]
filipsobol Sep 16, 2024
f25bdd5
Docs fix [short flow]
filipsobol Sep 16, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
28 changes: 28 additions & 0 deletions docs/updating/nim-migration/migration-to-new-installation-methods.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -169,6 +169,34 @@ ClassicEditor
</script>
```

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
<!-- Style sheets -->
<link rel="stylesheet" href="https://cdn.ckeditor.com/ckeditor5/{@var ckeditor5-version}/ckeditor5.css" />
<link rel="stylesheet" href="https://cdn.ckeditor.com/ckeditor5-premium-features/{@var ckeditor5-version}/ckeditor5-premium-features.css" />

<!-- Scripts -->
<script src="https://cdn.ckeditor.com/ckeditor5/{@var ckeditor5-version}/ckeditor5.umd.js"></script>
<script src="https://cdn.ckeditor.com/ckeditor5-premium-features/{@var ckeditor5-version}/ckeditor5-premium-features.umd.js"></script>

<!-- Translations -->
<script src="https://cdn.ckeditor.com/ckeditor5/{@var ckeditor5-version}/translations/pl.umd.js"></script>
<script src="https://cdn.ckeditor.com/ckeditor5-premium-features/{@var ckeditor5-version}/translations/pl.umd.js"></script>

<script>
const { ClassicEditor, Essentials, Bold, Italic, Paragraph, Mention } = CKEDITOR;
const { FormatPainter, SlashCommand } = CKEDITOR_PREMIUM_FEATURES;

ClassicEditor
.create( document.querySelector( '#editor' ), {
plugins: [ Essentials, Bold, Italic, Paragraph, Mention, FormatPainter, SlashCommand ],
toolbar: [ /* ... */ ],
licenseKey: '<LICENSE_KEY>'
} );
</script>
```

### What's new?

There are a few things that stand out in both examples compared to the old installation methods:
Expand Down
2 changes: 1 addition & 1 deletion docs/updating/nim-migration/online-builder.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@ The CDN build is a good option to quickly add CKEditor&nbsp;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&nbsp;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 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

Expand Down
Loading