You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: modules/ROOT/pages/advanced/creating-a-skin.adoc
+1-1Lines changed: 1 addition & 1 deletion
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -6,7 +6,7 @@
6
6
:keywords: create creator skin icomoon
7
7
:title_nav: Create a Skin
8
8
9
-
Creating a new skin will allow you to alter the appearance of TinyMCE. If you would like to create your skin, there are two ways of doing so. The simplest way is to use the http://skin.tinymce.com/[TinyMCE Skin Creator] tool. The other option is to manually modify `less` files and build them using the node js build process. Since the skin creator is pretty self-explanatory, we will focus on the manual method in this tutorial.
9
+
Creating a new skin will allow you to alter the appearance of TinyMCE. If you would like to create your skin, there are two ways of doing so. The simplest way is to use the link:{skintool}[TinyMCE Skin Creator] tool. The other option is to manually modify `less` files and build them using the node js build process. Since the skin creator is pretty self-explanatory, we will focus on the manual method in this tutorial.
If you would like to add your custom keyboard shortcuts to TinyMCE, https://go.tinymce.com/blog/creating-keyboard-shortcuts-tinymce/[this post on our blog] will help you get started.
177
+
If you would like to add your custom keyboard shortcuts to TinyMCE, link:{blogsite}creating-keyboard-shortcuts-tinymce/[this post on our blog] will help you get started.
To load TinyMCE for the very first time, you need to embed the TinyMCE editor code into your application. The code embedding is done by adding the following script tag into your app, or in the case of a web page the `<head>` of the page:
Migrating from a Self-hosted environment to the Cloud is a relatively straightforward process. Please remove your existing script tag that loads TinyMCE's JavaScript (typically a reference to `tinymce.min.js` either hosted in your application or available via one our legacy CDNs). Now, replace this script tag with the following:
The `stable` in this URL specifies the latest release of TinyMCE that completed our quality assurance testing process, successfully. If you are not using the latest, stable TinyMCE version, you can customize this value. You'll find all https://cloud.tinymce.com/versions/tiny[supported versions here].
@@ -33,9 +33,9 @@ Major version number (e.g. "4").
33
33
34
34
The following would load TinyMCE _4.latest.latest_:
This channel deploys the latest release of TinyMCE that has passed our quality assurance process. The current version of TinyMCE available through the `stable` channel https://cloud.tinymce.com/stable/version.txt[can be found here].
103
+
This channel deploys the latest release of TinyMCE that has passed our quality assurance process. The current version of TinyMCE available through the `stable` channel https://cdn.tiny.cloud/1/no-api-key/tinymce/stable/version.txt[can be found here].
Copy file name to clipboardExpand all lines: modules/ROOT/pages/general-configuration-guide/basic-setup.adoc
+2-2Lines changed: 2 additions & 2 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -233,7 +233,7 @@ You will find full list of link:{rootDir}configure/index.html[configuration opti
233
233
234
234
To help get you started, let's walk through an example of a basic TinyMCE configuration.
235
235
236
-
[source,html]
236
+
[source,html,subs=+attributes]
237
237
----
238
238
<!DOCTYPE html>
239
239
<html>
@@ -273,7 +273,7 @@ First, we want to select only the `textarea` with the id `myTextarea`.
273
273
selector: '#myTextarea',
274
274
----
275
275
276
-
We next choose a theme, in this case, the modern theme (which is the default theme, so this isn't needed. You can, however, create your own themes using the http://skin.tinymce.com/[TinyMCE Skin Creator]).
276
+
We next choose a theme, in this case, the modern theme (which is the default theme, so this isn't needed. You can, however, create your own themes using the link:{skintool}[TinyMCE Skin Creator]).
Copy file name to clipboardExpand all lines: modules/ROOT/pages/general-configuration-guide/customize-ui.adoc
+1-1Lines changed: 1 addition & 1 deletion
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -20,7 +20,7 @@ However, TinyMCE skins are much easier to make thanks to the TinyMCE Skin Creato
20
20
21
21
Unlike TinyMCE themes, which affect much more than just the editor's user interface, skins only change the editor's appearance.
22
22
23
-
If you would like to create your skins the best (and easiest) place to start is the http://skin.tinymce.com/[TinyMCE Skin Creator].
23
+
If you would like to create your skins the best (and easiest) place to start is the link:{skintool}[TinyMCE Skin Creator].
24
24
25
25
Once you've created your skin, download it, unzip the file, and place it in the ``js/skins ``folder of your TinyMCE install. Then activate it using code similar to this:
In the following example, the page is broken into two separate editable areas, each sharing a single editor configuration. Each editable `div` is provided the same `class` of 'myeditablediv'. When the user clicks within the content area, TinyMCE is loaded for just that area.
17
17
18
-
[source,html]
18
+
[source,html,subs=+attributes]
19
19
----
20
20
<!DOCTYPE html>
21
21
<html>
@@ -56,7 +56,7 @@ In this next example, each editable area is loaded with an instance of TinyMCE w
Enabling inline editing mode is simple. Setting the `inline` configuration property to `true` is all that's needed, in combination with a normal `selector`. It is important to keep in mind that, unlike the classic form-based mode, inline only works with content that is within a block element (e.g. `div`, `h1`). An example of using inline editing mode with a div is as follows:
0 commit comments