Cloud deployment of editor & plugins

优质

小牛编辑

123浏览

2023-12-01

Tiny Cloud is the easiest way to integrate TinyMCE and upgrade to premium plugins.

Tiny Cloud can be used without an API key. Refer to the Introduction & getting started guide for more information. Sign up for an API key and update the script tag to use premium plugins or avoid the in-editor developer warning.

All Tiny Cloud accounts include a free, pre-configured cloud image proxy service. This setup uses the Image tools plugin.

Integrating TinyMCE for the first time

Step 1: Insert the Tiny Cloud script tag into the webpage

Insert the TinyMCE editor code into the application to load TinyMCE for the first time. The code inserting is done by adding the following script tag into your app, or in the case of a web page the <head> of the page:

The following example adds a script tag into the application that inserts the code. Use the <head> of the page on a web page.

<script src="https://cloud.tinymce.com/5/tinymce.min.js?apiKey=your_API_key"></script>

Step 2: Load, customize and interact with TinyMCE

There are more than 40 open source plugins that enhance the editing experience in addition to the advanced content create solutions on Tiny Cloud. A range of simple examples are available. Refer to the Quick start section for more information.

Step 3: Specifying purchased TinyMCE plugins and toolbar/menu items

Extend the TinyMCE configuration to include any additional purchased plugins and associated toolbar and menu items. Refer to the following enablement guides for more information:

Mentions
Tiny Drive
Comments 2.0
Page Embed
Permanent Pen
Format Painter
PowerPaste
Spell Checker Pro

Note: spellchecker_rpc_url is not required when enabling this plugin via Tiny Cloud.

Image Tools (with configured image proxy)

Note: Configuration of the imagetools_cors_hosts and imagetools_proxy properties occurrs automatically.

Moxie Manager
Accessibility Checker
Advanced Code Editor
Enhanced Media Embed
Link Checker

Note: It may take up to 30 minutes for the purchased plugin to be available to TinyMCE. Clear the browser’s cache.

Step 4: Forward proxy configuration

Ensure that the following URLs are accessible via this proxy if the network has a forward proxy that controls access to the internet.

All URLs where the editor is deployed.
All URLs where the plugins are deployed.
https://imageproxy.tinymce.com
https://hyperlinking.tinymce.com
https://spelling.tinymce.com

Ensure the tiny-api-key and tinymce-api-key headers are retained while requesting the list of above URLs.

Step 5: Specifying a translation

Download a language pack to enable a language other than English (US). Specify its location with the language_url configuration option.

Migrating from a self-hosted environment to Tiny Cloud

Step 1: Replace existing reference to tinymce.min.js

Migrating from a self-hosted environment to Tiny Cloud is easy. Remove the existing script tag that loads TinyMCE’s JavaScript.

Note: The script tag typically references tinymce.min.js hosted within the application or available at a legacy CDN.

Replace the script tag with the following:

<script src="https://cloud.tinymce.com/5/tinymce.min.js?apiKey=your_API_key"></script>

Step 2: Update custom plugin paths

Reference external_plugins to ensure custom plugins or modified plugins continue to function in the Cloud deployment.

Warning! Do not use the regular plugins configuration element.

Step 3: Specify purchased TinyMCE plugins and toolbar buttons

Extend the TinyMCE configuration to include any additional purchased plugins and associated toolbar and menu items. Refer to the following enablement guides for more information:

Mentions
Tiny Drive
Comments 2.0
Page Embed
Permanent Pen
Format Painter
Powerpaste
Spell Checker Pro

Note: spellchecker_rpc_url is not required when enabling this plugin via Tiny Cloud.

Image tools (with configured image proxy)

Note: Configuration of the imagetools_cors_hosts and imagetools_proxy properties occurrs automatically.

Moxie Manager
Accessibility Checker
Advanced Code Editor
Enhanced Media Embed
Link Checker