MODX Deutschland - Forum - Automatisch Thumbnail und Link zu Originalbild in TinyMCE?

Automatisch Thumbnail und Link zu Originalbild in TinyMCE?

FlipFlop — Sat, 27 Feb 2010 17:54:06 +0100

Hallo Leute,

ich steck grad wieder mal fest. Wie immer weil ich etwas recht einfaches suche/brauche und dann ewig irgendwo stecken bleibe
Wie auch immer, der Betreff lässt bereist mein Problem vermuten. Ich suche eine Lösung für:
Ich möchte im TinyMCE ein Bild einfügen und folgendes soll, am besten automatisch, erfolgen:

Generierung eines Thumbnails (mit Lupe oder +Zeichen - mus aber nicht sein)
Verlinkung auf eine größere Ausgabe des Bildes
Verwendung von Effekten á la Lightbox oder Slimbox o.ä.
Am betsen mit JQuery da ich das im Einsatz habe um Email-Adressen zu ver- & entschlüsseln, siehe Thema

Versucht habe ich schon

DirectResize 0.8.0 bis 0.9 (manchmal liest man, dass DirectResize nicht mehr supported wird, im Repository wird es allerdings noch angeboten(?)) Version 0.8.0 macht nichts, deswegen auch nichts falsch und 0.9 erzeugt weiße Seiten (vermutlich einen PHP-Error den mir mein Webhoster nicht zeigen möchte)
Slimbox2 geht so, es funktioniert wenn man Thumb und Link zum Original inkl. rel="lightbox" im TinyMCE selbst macht --> für mich OK, für meinem Redaktuer kaum bis nicht zumutbar

Leider hilft mir dieser Thread auch nicht weiter da dort die Lösung mit mootools beschrieben ist...

Hat jemand noch einen Tipp?
Grüße
Michi

Automatisch Thumbnail und Link zu Originalbild in TinyMCE?

Marc — Sat, 27 Feb 2010 18:36:47 +0100

Leider hilft mir dieser Thread auch nicht weiter da dort die Lösung mit mootools beschrieben ist...

Und was spricht dagegen?

Automatisch Thumbnail und Link zu Originalbild in TinyMCE?

rasc — Sat, 27 Feb 2010 21:05:22 +0100

Wenn Du slimbox nicht willst, ColorBox lässt sich auch problemlos nutzen und ist jQuery-basiert.

Automatisch Thumbnail und Link zu Originalbild in TinyMCE?

FlipFlop — Sat, 27 Feb 2010 22:43:03 +0100

Hi,

@Marc - ja das frage ich mich auch leider bin ich kein guter JavaScripter, demnach such ich immer nach nehzu passenden fertigen Lösungen. Das EMailObfuscate habe ich nur mit JQuery hinbekommen, den Tabbed Content auch.
Bin mir sicher das geht alles auch mit Mootools - meist fehlt's mir aber dann aber Knowhow und Zeit. Was sagt ihr eigentlich dazu? Soll man sich eher an Mootools halten oder in welche Richtung entwicklet sich MODx?

@rasc - danke werde mir ColorBox näher ansehen.

Automatisch Thumbnail und Link zu Originalbild in TinyMCE?

FlipFlop — Sat, 27 Feb 2010 22:54:44 +0100

@rasc:

Wenn Du slimbox nicht willst, ColorBox lässt sich auch problemlos nutzen und ist jQuery-basiert.

ColorBox scheint recht gut zu gehen, zumal die ersten Versuche - aber das gemütliche "Ich bin Redakteur und muss nur das Bild im TinyMCE einfügen" spielt es nicht so ganz - oder? Thums werden nicht automatisch erzeugt, Verlinkung auch nicht und rel= muss auch manuell hinzugefügt werden (zumindest über Dropdown)
Da ich einst aus der Typo3 Ecke kam: Dort war das ein Häckchen...

Automatisch Thumbnail und Link zu Originalbild in TinyMCE?

rasc — Sat, 27 Feb 2010 23:39:16 +0100

Thums werden nicht automatisch erzeugt, Verlinkung auch nicht und rel= muss auch manuell hinzugefügt werden (zumindest über Dropdown)

Yup

Ich kenne die Innereien von T3 nicht, aber kann man da im RTE wirklich mit nur einem Häkchen sowas machen??? Du fügst ein Bild ein, setzt ein Häkchen und der Rest sitzt??? Lässt sich in MODx sicher auch über eine Formatzuweisung am Bild erledigen, wenn jQuery den Rest erledigt. Braucht halt ein wenig JS-Erfahrung ...

Automatisch Thumbnail und Link zu Originalbild in TinyMCE?

Marc — Sun, 28 Feb 2010 07:56:00 +0100

Die Frage ist halt: Wie groß ist so ein Thumbnail, wie groß das Ziel? Man muss ja schon irgendwo irgendwie einstellen, wie groß das sein soll. Eine einfache Klassen-Zuweisung tut es da ja nicht, solange die Thumbs nicht immer gleich groß sind und das Zielformat eine vernünftige Größe hat.

Wie sind denn da die Voraussetzungen bei Dir?

Wenn DirectResize nicht mehr funktioniert wird es natürlich schwieriger. Ich kenne aus dem Stegreif kein alles-automatisch-Plugin. Sind allerdings Zielbilder in einer vernünftigen Größe und die Thumbs immer gleich groß, ließe sich das sicher recht automatisch lösen.

Automatisch Thumbnail und Link zu Originalbild in TinyMCE?

Thomas108 — Sun, 28 Feb 2010 10:21:38 +0100

In modx 1.0 funktioniert Direct-Resize auf jeden Fall noch. Zu 1.2 kann ich aber nichts sagen.
Allerdings hat es lokal mit PHP5.3 auf Xampp nicht funktioniert.
Online mit PHP 5.2 dagegen schon.

Automatisch Thumbnail und Link zu Originalbild in TinyMCE?

sharkbait — Sun, 28 Feb 2010 11:16:58 +0100

Hallo zusammen

...auf dieser Seite habe ich eine DirectResizeLight Version gefunden die superleicht und schnell installiert ist: http://community.modx-cms.ru/blog/dev/12.html -> http://translate.google.com/translate?js=y&prev=_t&hl=en&ie=UTF-8&layout=1&eotf=1&u=http%3A%2F%2Fcommunity.modx-cms.ru%2Fblog%2Fdev%2F12.html&sl=ru&tl=en

1. lade diese Zip-Datei runter: http://dl.dropbox.com/u/1951410/directresize.zip entpacke und platziere den Ordner "directresize" nach assets -> plugins

2. erstelle ein neues plugin "DirectResizeLite", Systemereignis: "OnWebPagePrerender" mit dem Code dieser Text-Datei: http://dl.dropbox.com/u/1951410/DirectResizeLite.txt

( ich habe es leicht abgeändert, um die jQuery Slimbox zu verwenden. Von Haus aus wäre es Highslide )
der Pfad zu dem Ordner aus dem die Bilder verkleinert werden sollen
$lien_base = "assets/images/resize"; (ggf. ändern)

3. erstelle in dem Ordner assets -> images einen Ordner "cache" und mache ihn beschreibbar, außerdem einen weiteren Ordner namens "resize"

4. in den Header deines Templates kommt dann:

...jetzt müsste es eigentlich schon funktionieren also, Bild in den Ordner "resize" hochladen, Title und Description, neue Größe angeben und in das Dokument einfügen - voilà

Gruß, j

MODx Evolution 1.0.2
PHP 5.2.9

Automatisch Thumbnail und Link zu Originalbild in TinyMCE?

FlipFlop — Tue, 02 Mar 2010 22:05:14 +0100

Hi sharkbait!

Das funktioniert sogar bestens!!!
Vielen Dank für die ausführliche Anleitung und für den modifizierten Code!

@rasc: Auch dir danke für den Tip mit der ColorBox, die im übrigen echt coole Effekte drauf hat - aber die Lösung mit DirectResizeLight ist einfach einfacher für den Redakteur
Bzgl. T3, nun dort ist es in der Tat so, dass man ein oder mehrere Bilder uploaded, die Thumbnail-Größe angibt und ein Häckchen bei Lightbox macht - im Prinzip nichts anderes als mit DirectResizeLight, dort wird kein Optionsfeld geprüft sondern das Vorhandensein von width und/oder height im img tag.

Grüße Michi

Automatisch Thumbnail und Link zu Originalbild in TinyMCE?

sharkbait — Tue, 02 Mar 2010 22:56:07 +0100

prima

Auch dir danke für den Tip mit der ColorBox, die im übrigen echt coole Effekte drauf hat - aber die Lösung mit DirectResizeLight ist einfach einfacher für den Redakteur

du könntest übrigens auch DR lite recht einfach für ColorBox anpassen

Automatisch Thumbnail und Link zu Originalbild in TinyMCE?

FlipFlop — Wed, 03 Mar 2010 21:25:55 +0100

hm, das werde oich mir ansehen - melde mich dann wenn gar nichts mehr geht

Automatisch Thumbnail und Link zu Originalbild in TinyMCE?

bmoebis — Sat, 17 Sep 2011 23:01:49 +0200

Nutze DirectResizeLite auf verschiedenen Projekten. Läuft super. Es gibt nur ein Problem. Wenn ich Bilder mit Seiten verlinken möchte, geht das nicht. Ich nehme an wegen dem systemereignis OnWebPagePrerender. Lässt sich DirectResizeLite für einzelne Seiten oder Templates deaktivieren, damit dort Bilder verlinkt werden können? Wie? - Ich mache ein neues Thema daraus.