TinyMCE Wysiwyg-Editor für Webseiten

Homepage: http://tinymce.moxiecode.com/index.php

Download: http://tinymce.moxiecode.com/download.php

Handbuch, englisch http://wiki.moxiecode.com/index.php/TinyMCE:Index

Projektseite/Bug-Reports: http://sourceforge.net/...

Projektseite/Patches: http://sourceforge.net/...

Projektseite (sourceforge): http://sourceforge.net/projects/tinymce/

Projektseite/News: http://sourceforge.net/news/...

Blitzanleitung zur Einbindung von TinyMCE in Webseiten

Peter Burkes, Stand 8.1.2009

Eine ordentliche Anleitung zur Einbindung fehlt im Handbuch. Die Konfigurationsmöglichkeiten sind im Wiki verstreut und relativ unverständlich. Ich habe deshalb hier die wichtigsten Einbindungsvarianten für TinyMCE zusammengefasst:

Allgemein: Die Einbindung erfolgt jeweils im Head der betreffenden Seite.

<html>
<head>
<script language="javascript" type="text/javascript" src="../jscripts/tiny_mce/tiny_mce.js"></script>
<script language="javascript" type="text/javascript">
tinyMCE.init({
theme : "advanced",
mode : "textareas"
});
</script>
</head>

Achtung! bei allen Javascript-Textteilen ist offenbar zu beachten, dass am Ende kein (befehlstrennende) Komma mehr steht, weil einige InternetExplorer-Versionen hiermit nicht klar kommen

Quelle: http://wiki.moxiecode.com/index.php/TinyMCE:Configuration

NOTE: Remember to remove the last "," character in the options list. In some versions of Microsoft Internet Explorer, not removing the final comma will cause tinyMCE to be initialized with the default settings.

Varianten:

I) Wandelt alle Textareas der HTML-Seite in Editorfelder um:

<script language="javascript" type=
"text/javascript" src="/scripts/tiny_mce/tiny_mce.js"></script>
<script language="javascript" type=
"text/javascript">
tinyMCE.init({
mode : "textareas"
});
</script>

Wandelt Textareas um, die einer bestimmten CSS-Klasse zugehören

tinyMCE.init({
mode: "specific_textareas",
theme: "simple",
editor_selector: "mceEinfach"
});

tinyMCE.init({
mode: "specific_textareas",
theme: "advanced",
editor_selector: "mceKomplex"
});

Im body:

<textarea id="myarea1" class="mceEditor">This will be an editor.</textarea>
<textarea id="myarea2">This will NOT be an editor.</textarea>

http://wiki.moxiecode.com/index.php/TinyMCE:Configuration/editor_selector

Wandelt eine ganz bestimmte (oder mehrere bestimmte) Textarea um, die mit einer CSS-ID versehen wurde

tinyMCE.init({
mode: "exact",
elements: "elm1, elm2, elm3",
theme: "simple",
});

Im body:

<textarea id="elm1" >...
<div id="elm2">...
<p id="elm3">...

http://wiki.moxiecode.com/index.php/TinyMCE:Configuration/mode

Wandelt alle Textareas um und nimmt spezielle Textareas aus, die mit einer CSS-Klasse versehen wurden
(editor deselector-Methode)

tinyMCE.init({
...
editor_deselector : "mceNoEditor"
});

Im body:

<textarea id="myarea1" class="mceNoEditor">This will NOT be an editor.</textarea>
<textarea id="myarea2">This will be an editor.</textarea>

http://wiki.moxiecode.com/index.php/TinyMCE:Configuration/editor_deselector

Links zu den Kapiteln des Original-Handbuchs

About TinyMCE
Installation instructions
- Examples
Language Pack
Reference
Customization
Compressor
How-Tos
Tips and tricks
Security
- How to prevent XSS if the user disables javascript?
Compatibility
- Compatibility chart
- Compatibility with thirdparty libraries
Content Management Systems with TinyMCE
Accessibility
Frequently asked questions
Credits
License (LGPL)

Aus der User-Archiv-Datenbank

Suchbegriff: tinymce

What You See Is What You Get: Vergleiche, NicEdit, TinyMce, Livepipe,

http://www.horas-reich.de/feed/2009/03/20/what-you-see-is-what-you-get-vergleiche-nicedit-tinymce-livepipe.html

Rubrik: Webseiten; Typ: Sonstige_Literatur