+ See the Pen {{ include.id }} + by TinyMCE (@tinymce) + on CodePen. +
+ diff --git a/try-tinymce/basic-example.md b/try-tinymce/basic-example.md index 0ab3802..5aa2a41 100644 --- a/try-tinymce/basic-example.md +++ b/try-tinymce/basic-example.md @@ -6,6 +6,16 @@ description: This example contains the plugins needed for the most common use ca keywords: example custom common standard normal typical --- -// working example to come +## Live example -// http://www.tinymce.com/tryit/basic.php +This example outlines the basic functionalities of TinyMCE and lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. + +{% include codepen.html id="YydQrY" %} + +### Example breakdown + +> ```js +toolbar: 'insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image' +``` + +As you can se we can alter the [toolbar]({{ site.baseurl }}/configure/configure/editor-appearance/#toolbar) passing lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. diff --git a/try-tinymce/custom-toolbar-button.md b/try-tinymce/custom-toolbar-button.md index 07865c0..27809fc 100644 --- a/try-tinymce/custom-toolbar-button.md +++ b/try-tinymce/custom-toolbar-button.md @@ -6,6 +6,4 @@ description: This example shows you how to add a custom button to the toolbar. keywords: example custom toolbar button --- -// working example to come - -// http://www.tinymce.com/tryit/button.php +{% include codepen.html id="NGegeZ" %} diff --git a/try-tinymce/custom-toolbar-listbox.md b/try-tinymce/custom-toolbar-listbox.md index 75c9ff3..210f9da 100644 --- a/try-tinymce/custom-toolbar-listbox.md +++ b/try-tinymce/custom-toolbar-listbox.md @@ -6,6 +6,4 @@ description: This example shows you how to add a simple listbox to the toolbar o keywords: example custom toolbar listbox --- -// working example to come - -// http://www.tinymce.com/tryit/listbox.php +{% include codepen.html id="JYwJVr" %} diff --git a/try-tinymce/format-custom.md b/try-tinymce/format-custom.md index 5c43dfb..25bf56d 100644 --- a/try-tinymce/format-custom.md +++ b/try-tinymce/format-custom.md @@ -6,6 +6,4 @@ description: This example shows you how to override the built in style formats a keywords: example custom format formats --- -// working example to come - -// http://www.tinymce.com/tryit/custom_formats.php +{% include codepen.html id="QjzgRW" %} diff --git a/try-tinymce/format-html5.md b/try-tinymce/format-html5.md index 96fc302..cd475a4 100644 --- a/try-tinymce/format-html5.md +++ b/try-tinymce/format-html5.md @@ -6,6 +6,4 @@ description: This example shows you how to edit HTML5 contents such as sections keywords: example custom format formats html5 --- -// working example to come - -// http://www.tinymce.com/tryit/html5_formats.php +{% include codepen.html id="dYwREe" %} diff --git a/try-tinymce/full-featured.md b/try-tinymce/full-featured.md index b56cec3..1c1350f 100644 --- a/try-tinymce/full-featured.md +++ b/try-tinymce/full-featured.md @@ -6,6 +6,4 @@ description: This example displays all plugins that comes with the TinyMCE packa keywords: example custom wysiwyg full-power full-featured --- -// working example to come - -// http://www.tinymce.com/tryit/full.php +{% include codepen.html id="NGegZK" %} diff --git a/try-tinymce/image-tools.md b/try-tinymce/image-tools.md index 48d9cbc..b022e9a 100644 --- a/try-tinymce/image-tools.md +++ b/try-tinymce/image-tools.md @@ -6,6 +6,4 @@ description: This example contains the plugins needed for the most common use ca keywords: example custom imagetools --- -// working example to come - -// http://www.tinymce.com/tryit/imagetools.php +{% include codepen.html id="epbRwB" %} diff --git a/try-tinymce/inline.md b/try-tinymce/inline.md index 9f50a13..d371b93 100644 --- a/try-tinymce/inline.md +++ b/try-tinymce/inline.md @@ -6,6 +6,4 @@ description: This example shows you the inline editing capabilities of TinyMCE. keywords: example custom inline --- -// working example to come - -// http://www.tinymce.com/tryit/inline.php +{% include codepen.html id="YydQoj" %} diff --git a/try-tinymce/url-conversion.md b/try-tinymce/url-conversion.md index 8e9bd74..0de2dcb 100644 --- a/try-tinymce/url-conversion.md +++ b/try-tinymce/url-conversion.md @@ -6,6 +6,4 @@ description: This example shows you how to setup TinyMCE to produce different re keywords: example custom url conversion absolute relative url urls --- -// working example to come - -// http://www.tinymce.com/tryit/url_conversion.php +{% include codepen.html id="Qjzgew" height="1700" %} diff --git a/try-tinymce/valid-elements.md b/try-tinymce/valid-elements.md index 4b24f50..a23151c 100644 --- a/try-tinymce/valid-elements.md +++ b/try-tinymce/valid-elements.md @@ -6,6 +6,4 @@ description: This example shows you how to use the extended_valid_elements optio keywords: example custom valid elements valid_elements --- -// working example to come - -// http://www.tinymce.com/tryit/valid_elements.php +{% include codepen.html id="LpMLwQ" %}