TinyMCE 4 - anniversary download - Jubiläumsdownload

CMSimple 4.0 und höher
Post Reply
Gert
Posts: 2075
Joined: Sun 18. Nov 2012, 14:18

TinyMCE 4 - anniversary download - Jubiläumsdownload

Post by Gert »

Image

Image Hallo,

am 11. November 2012 habe ich, nach erfolgreich abgeschlossenen Domain Transfers, CMSimple 4.0 veröffentlicht. Pünktlich zum 3-jährigen Jubiläum von CMSimple 4 gibt es den von vielen schon lange erwarteten Editor TinyMCE 4 für CMSimple 4.5 oder höher.

Der TinyMCE 4 für CMSimple ist ein Gemeinschaftsprojekt von Martin und mir. Martin hat das meiste programmiert, ich habe mich um Design und Finishing gekümmert. Vielen Dank an Martin für seinen Einsatz für CMSimple.

Download: http://www.cmsimple.org/?Downloads___Editoren_TinyMCE

Der Download enthält auch den letzten in CMSimple enthaltenen TinyMCE 3, damit Ihr bei Bedarf den alten Editor wieder installieren könnt,

viel Spass - Gert

=====================================================

Image Hello,

on 11 November 2012, after the successful completion of domain transfer, I have published CMSimple 4.0. Just in time for the 3-year anniversary of CMSimple 4, the long-awaited TinyMCE 4 is available for CMSimple 4.5 or higher.

The TinyMCE 4 for CMSimple is a joint project of Martin and me. Martin has programmed the most of the code, and I made design and finishing. Many thanks to Martin for his commitment to CMSimple.

Download: http://www.cmsimple.org/en/?Downloads___Editors_TinyMCE

The download also contains the last TinyMCE 3 contained in CMSimple, so that the old editor can be installed again, if necessary,

have fun - Gert
Last edited by Gert on Sat 21. Nov 2015, 17:00, edited 3 times in total.
Gert Ebersbach | CMSimple | Templates - Plugins - Services
Hixi
Posts: 84
Joined: Sat 22. Dec 2012, 22:46

Re: TinyMCE 4 - anniversary download - Jubiläumsdownload

Post by Hixi »

Hallo Gert

Herzliche Gratulation zum 3-jährigen Jubiläum!

...Und vielen Dank für die tolle Arbeit! :D

Liebe Grüsse aus der Schweiz

Susanne + Beat
Hixi
Posts: 84
Joined: Sat 22. Dec 2012, 22:46

Re: TinyMCE 4 - anniversary download - Jubiläumsdownload

Post by Hixi »

Hallo Gert

Wir haben eben eine Page mit dem neuen Editor bearbeitet und folgendes festgestellt: Beim Einfügen/Verändern von Bildern fehlt das Register "Aussehen". Wir können weder die exakte Grösse noch die genaue Position eingeben. Haben wir da etwas übersehen?

Vielen Dank fürs Prüfen.

Beste Grüsse

Susanne + Beat
Gert
Posts: 2075
Joined: Sun 18. Nov 2012, 14:18

Re: TinyMCE 4 - anniversary download - Jubiläumsdownload

Post by Gert »

Hallo,

als erstes empfehle ich, nach einem Update des Editors auf TinyMCE 4 die Toolbar "full" einzustellen. Die Menüzeile über dem Editor bietet ein paar erweiterte Möglichkeiten.

Ja, der TinyMCE 4 schneidet ein paar alte Zöpfe ab, und das ist auch gut so. Der 3er hat noch die Bildabmessungen ins html geschrieben, was dann zum Problem wurde, wenn man das Bild per CMS responsiv machen wollte. Da musste man diese Felder erst leeren.

Der 4er hat nun im Bilddialog einen Reiter "Erweitert", mit dem kann man das Bild per CSS stylen. Damit erzeugt man aber inline-CSS, auch verpönt im Augenblick. Tragt mal bei Vertikaler Abstand, Horizontaler Abstand und Rahmen Zahlen ein, geht raus aus dem Menü und wieder rein, dann seht Ihr alle Werte oben in der Zeile "Stil".

Der richtige, naja, beste Weg (wer weiss schon, was "richtig" ist) ist die Definition von Bildklassen im Template. Wir haben eine kontextbezogene Klassenerkennung eingebaut, mit der man Bildern Klassen zuordnen kann.

In meinen Templates findet Ihr Klassen wie z. B.:

Code: Select all

.tplge_left_border {float: left; border: 5px solid #998; margin: 0 20px 10px 0;}
.tplge_left_noborder {float: left; border: 0; margin: 0 20px 10px 0;}
.tplge_right_border {float: right; border: 5px solid #998; margin: 0 0 10px 20px;}
.tplge_right_noborder {float: right; border: 0; margin: 0 0 10px 20px;}
.tplge_border {border: 5px solid #998;}
.tplge_noborder {border: 0;}
Die kann man ergänzen zu:

Code: Select all

img.tplge_left_border {float: left; border: 5px solid #998; margin: 0 20px 10px 0;}
img.tplge_left_noborder {float: left; border: 0; margin: 0 20px 10px 0;}
img.tplge_right_border {float: right; border: 5px solid #998; margin: 0 0 10px 20px;}
img.tplge_right_noborder {float: right; border: 0; margin: 0 0 10px 20px;}
img.tplge_border {border: 5px solid #998;}
img.tplge_noborder {border: 0;}
... also ein "img" davorsetzen. Dann erkennt der TinyMCE 4 diese Klassen als Bildklassen.

Dann einfach das Bild anklicken und das Menü oben in der Toolbar benutzen:

Format => Formate => Bildformate

Man kann einem Bild mehrere Klassen zuordnen, dem Bild bereits zugeordnete Klassen sind mit einem hellgrauen Balken links vor der Klasse gekennzeichnet. Allerdings geht das nicht in einem Zug, wenn ich eine Klasse anklicke, schliesst sich das Menü, und ich muss neu Anlauf nehmen :roll:

Man muss sich eine neue Denk- und Arbeitsweise aneignen, das Ergebnis ist aber besser.

Man kann auch die Klassen in eine image_class_list eintragen, dann erscheinen sie im Bilddialog als Dropdown Liste. Man kann die Klassen gruppieren und ihnen verständliche Namen geben. So kann man den Editor für seine Kunden anpassen und das Einfügen von Bildern erleichtern. Dazu sollte man aber eine eigene init-Datei anlegen (Kopie der init_full.js, Name z. B. init_myeditor.js) und aktivieren, die bei späteren Updates nicht überschrieben wird.

Hier die Erklärung:

http://www.tinymce.com/wiki.php/Configu ... class_list

Unter "plugins" ist images in allen init Dateien bereits eingetragen, die Zeile in der init Datei könnte dann so aussehen:

Code: Select all

image_class_list: [
        {title: 'Keine Klasse', value: ''},
        {title: 'Bild links ohne Rahmen', value: 'tplge_left_noborder'},
        {title: 'Bild links mit Rahmen', value: 'tplge_left_border'},
        ...
    ],
Unter "value" werden die Klassen aus dem Template Stylesheet eingetragen, die dann natürlich auch ohne vorangestelltes "img" verwendet werden können. Vorbereiten kann ich das ganze aber nicht, weil ich nicht wissen kann, welche Klassen im Template des Anwenders zur Verfügung stehen.

Man kann aber auch einfach dem Kunden ein wenig CSS beibringen und inline-CSS tolerieren (für mich kein Problem) - dann kann er einfach den Reiter "Erweitert" im Bilddialog benutzen und dje Bilder per css formatieren. Das ist dann auch am flexibelsten,

Gert

PS: Das ganze mag sich jetzt kompliziert anhören, aber wenn man es einmal gemacht hat, lacht man drüber. Die Kunden werden es einem auf jeden Fall danken.
Gert Ebersbach | CMSimple | Templates - Plugins - Services
Gert
Posts: 2075
Joined: Sun 18. Nov 2012, 14:18

Re: TinyMCE 4 - anniversary download - Jubiläumsdownload

Post by Gert »

Hallo,

im FAQ Bereich habe ich jetzt mal ein Beispiel veröffentlicht, wie man Klassen für den Bilddialog des TinyMCE 4 bereitstellt. Das Beispiel macht die Bilder responsiv, man muss eigenlich nur den Rahmen an seinen Geschmack und das Template anpassen (Dicke und Farbe):

http://www.cmsimple.org/forum/viewtopic.php?f=20&t=615

Wenn es noch Fragen gibt - nur zu,

Gert
Gert Ebersbach | CMSimple | Templates - Plugins - Services
Gert
Posts: 2075
Joined: Sun 18. Nov 2012, 14:18

Re: TinyMCE 4 - anniversary download - Jubiläumsdownload

Post by Gert »

Image Hallo,

ein neuer Download mit neuen init-Dateien ist online: CMSimple Editoren 2.0

Der TinyMCE 4 erlaubt jetzt das einfügen von JavaScript in den Inhalt. Ich habe lange überlegt, ob das erlaubt sein sollte. Den Ausschlag gab die Tatsache, dass im TinyMCE 3 das einfügen von Scripten in den Inhalt erlaubt war, und diese vom TinyMCE 4 nicht gelöscht werden sollen nach einem Update.

Download: http://www.cmsimple.org/en/?Downloads___Editors_TinyMCE

viel Spass - Gert

=====================================================

Image Hello,

a new download with new ini files is online: CMSimple Editors 2.0

The TinyMCE 4 now allows you to insert JavaScript in the content. I have long thought about, whether this should be allowed. The deciding factor was the fact, that TinyMCE 3 has allowed pasting of scripts in the content, and these scripts should not be deleted from TinyMCE 4 after an update.

Download: http://www.cmsimple.org/en/?Downloads___Editors_TinyMCE

have fun - Gert
Gert Ebersbach | CMSimple | Templates - Plugins - Services
smi
Posts: 19
Joined: Tue 21. Jan 2014, 20:26

Re: TinyMCE 4 - anniversary download - Jubiläumsdownload

Post by smi »

Hallo an alle,

Nach dem Update auf 4.6.2 bin ich nun auch auf Editor TineMCE4.
Das Register "Aussehen" benutzte ich in TineMCE3 auch gerne um Bildern eine feste Größe zu geben. Ich verwende das in Beiträgen als Vorschau bzw. Gestaltungsmittel in der Größenordnung 300px breit. Die Möglichkeit der Image Classes finde ich einmal eingerichtet aber sehr praktisch. Danke an Gert für die Beschreibung in diesem Thread und in den FAQ's.

Weiters benutze ich gerne einen Link auf dem verkleinerten Image, der auf das Bild selbst zeigt um es auf Wunsch/bei Bedarf in Originalgröße in einer Lightbox anzeigen zu lassen (class="shutter"). Die Anpassung war nur im Quelltext möglich, obwohl der Dialog "Link einfügen/verändern eine Klassenzuweisung hatte. Die "shutter" Klasse war aber darin nicht auswählbar.
Ist es möglich die Klassendefinition "shutter" für Links auch über den Editor zu treffen, bzw. gibt es eine andere Möglichkeit Bilder in einer Lightbox zu öffnen.

(Plugin fotogalerie ist installiert)

Schöne Grüße
Gert
Posts: 2075
Joined: Sun 18. Nov 2012, 14:18

Re: TinyMCE 4 - anniversary download - Jubiläumsdownload

Post by Gert »

smi wrote:Ist es möglich die Klassendefinition "shutter" für Links auch über den Editor zu treffen ...
Finde da auch nix - musst Du wohl weiterhin im Quelltext machen :(

Da Du weder class= noch rel= einem Link per Editor zuordnen kannst, wird das mit anderen Lightboxen auch nicht anders sein,

Gert
Gert Ebersbach | CMSimple | Templates - Plugins - Services
Post Reply