Aktuelle Plugins für das Einrücken in TinyMCE

Question

Ich habe stundenlang nach einem Plugin gesucht, das ähnlich wie "padding: 5px" zu einem Bild hinzufügen würde. Machen das alle durch einfaches html? Unser Kunde braucht eine Möglichkeit, dies einfach mit Hilfe einer Schaltfläche oder des Kontextmenüs "Rechtsklick" hinzufügen zu können. Irgendwelche Vorschläge/Lösungen oder muss ich das selbst entwickeln?

Vorschläge zu anderen Produkten als TinyMCE sind nicht notwendig.

Answer 1

Am einfachsten zu verwenden ist es, ein benutzerdefiniertes Stylesheet hinzuzufügen, das nur als Parameter festgelegt werden muss (content_css). Beispielcode-Schnipsel für die tinymce-Konfiguration:

...
theme: 'advanced',
content_css: "http://my_server/my_css/my_custom_css_file.css",
...

Dieses CSS sollte etwas Ähnliches wie das Folgende enthalten:

img {
    padding-left: 5px;
}

Der Code für die Tinymce-Schaltfläche ist etwas komplexer (aber wenn gewünscht, kann ich ihn auch posten) und das CSS wird folgendermaßen festgelegt:

$(ed.get('my_editor_id').getBody()).find('img').css('padding-left','5px');

UPDATE: Schaltflächen-Code:

tinyMCE.init({
   ...
   setup : function(ed) {
      ed.onInit.add(function(ed, evt) {
          ed.addButton ('wrap_div', {
            'title' : 'mein Titel',
            'image' : 'mein_bild.png',
            'onclick' : function () {
                ed.getBody().find('img').css('padding-left','5px');
            }
        });
      });
   }
});