rel-Attribute für Lightbox in TinyMCE

[Gast170816]

Hallo,

ich will über tiny-mce lightbox-Bilder einbinden und dazu brauche ich das rel-Attribut. Dazu habe ich folgende Lösung im Netz gefunden http://www.bibblan.com/martin/tinymce-rel-with-lightbox


Nach dieser Lösung klappt es schon, dass mein Link <a> eine class "lightbox" hat.
Von tiny_mce - Seite her ist also eigentlich alles erledigt denke ich.

Jedoch dann per Javascript zu "lightbox"-class ein "lightbox"-rel-Attribut hinzufügen klappt nicht. Mein Code sieht folgendermaßen aus, und soll eben alle <a>, die class="lightbox" haben um rel="lightbox" ergänzen. Er ist ganz oben im head eingefügt, das lightbox-Script selbst hab ich erstmal noch nicht eingefügt, denn das hinzufügen von rel zu <a> müsste ja auch so funktionieren.

document.observe('dom:loaded', function () {
    $$('a[class^=lightbox]').each(function(s) {
        s.rel = 'lightbox';
    });
});

Na jedenfalls, das funktioniert nicht... ich bekomme kein rel-Attribut.

Weiß evtl. jemand, was falsch ist?

PS: Und gerade überlege ich...Mit eine rel="lightbox" allein ist es nicht getan...Tiny-mce müsste irgendwie noch um ein Eingabefeld ergänzt werden, wo man selbst eine "rel" angeben kann. Denn das rel--Attribut muss doch letztlich in etwa so aussehen rel="lightbox[kategoriename]"!

 

[Sven Mintel]

Moin,

das rel-Attribut gehört ja in den Link um das Bild, und bei TinyMCE kannst du im Link-Popup unter "Advanced" auch ein rel-Attribut wählen(Lightbox ist dort in der Auswahlliste zumindest bei mir schon vorhanden)

Für freigewählte Gruppen-Namen findest du hier eine Möglichkeit: http://tinymce.moxiecode.com/punbb/viewtopic.php?pid=43868#p43868

 

[Gast170816]

Du beziehst dich vermutlich auf dieses "advlink"-Plugin, was man extra noch freischalten muss, oder?

Dieses Plugin hatte ich bislang noch nicht aktiviert, weil ich dachte, es müsste doch auch irgendwie so gehen, dass ich ein beliebiges Attribute plus Eingabefeld für einen eigenen Wert, dort irgendwie einfügen kann. Denn, wie ich auch so eine Klasse jedoch mit festem Namen einem Link zuweise weiß ich ja schon.

Das mit dem "advlink" hatte ich mal ausprobiert, aber irgendwie nicht so kapiert... Ich gehe da aufs eingefügte Bild, Klick dann aber aufs Link-Icon, wähle "rel=Lightbox", speichere mit "insert"... aber irgendwie passiert da auch nix. Gehe ich jetzt nochmal in des Link ist die "rel=Lightbox"-Auswal wieder weg und im Frontend ist es nichtmal ein klickbares Bild.

In deinem verlinkten Tutorial...wie ist das gemeint, mit <input>? Ich hab da mal eingegeben, gespeichert und nochmal den Editor aufgerufen, da war alles wie vorher (also nur die rel-Auswahlliste)...ich dachte, das würde evtl. ein Eingabefeld für mein "rel" erzeugen, das wär nämlich im Prinzip alles, was ich brauche. Den ganzen anderen komplexen Kram brauch ich nicht. Ein Feld um "rel" erstmal anzuschalten und dann eben um dort einen Namen einzutippen. Und eine einfache Auswahl eines Bildes als Ziel des Links. Im Moment sitze ich da, klicke auf den image-Button füge ein Thumb-Bild ein, gehe wieder raus, klicke auf den Linkbutton und tippe dort von Hand das Ziel zum großen Bild ein. Ich dachte irgendwie, das müsste man einfacher zusammen fassen können, entweder im image-Bedienbereich sagen, "nimm dieses Bild als Ziel" und "das andere bzw. das selbe nur kleinskaliert, als Thumb"...oder eben wenn ich schon nach dem Bild einfügen extra noch auf Link einfügen klicken muss, dann dort irgendwie mit klickbarer Bildauswahl, statt ZielURL eintippen.

EDIT:
Im Backend, wo man tinymce intialisiert hab ich übrigens folgendes im Code stehen:

theme : "advanced",
language : "en",
relative_urls : false,
remove_script_host : false,
plugins : "searchreplace,txpimage,advlink",
theme_advanced_buttons1 : "bold,italic,underline,strikethrough,forecolor,backcolor,removeformat,numlist,bullist,outdent,indent,justifyleft,justifycenter,justifyright,justifyfull",
theme_advanced_buttons2 : "link,unlink,separator,image,separator,search,replace,separator,cut,copy,paste,separator,code,separator,formatselect",
theme_advanced_buttons3 : "",
theme_advanced_toolbar_location : "top",
theme_advanced_styles : 'Link to Bild=lightbox',
theme_advanced_toolbar_align : "left",entity_encoding : "numeric",
height:"420",

 

[stefanjost]

Na jedenfalls, das funktioniert nicht... ich bekomme kein rel-Attribut.

Weiß evtl. jemand, was falsch ist?

Im HTML-Header müssen zuerst die JavaScript-Dateien von Lightbox eingebudnen sein, erst danach der DOM-Code zum Einfügen der rel-Attribute

PS: Und gerade überlege ich...Mit eine rel="lightbox" allein ist es nicht getan...Tiny-mce müsste irgendwie noch um ein Eingabefeld ergänzt werden, wo man selbst eine "rel" angeben kann. Denn das rel--Attribut muss doch letztlich in etwa so aussehen rel="lightbox[kategoriename]"!

ja, sehe ich auch so, in dieser einfachen Variante ist der optionale Kategorien-Parameter nicht drin