Hier werden die Unterschiede zwischen zwei Versionen gezeigt.
Beide Seiten der vorigen Revision Vorhergehende Überarbeitung Nächste Überarbeitung | Vorhergehende Überarbeitung | ||
addons:modules:blackgallery:lightbox:rlightbox [2014/05/26 18:45] shadowcat [Schritt 3: Liste bereinigen] |
addons:modules:blackgallery:lightbox:rlightbox [2014/05/26 00:00] (aktuell) |
||
---|---|---|---|
Zeile 1: | Zeile 1: | ||
- | ====== Lightbox hinzufügen ====== | + | ====== Andere Lightbox hinzufügen ====== |
Wir gehen jetzt mal von ungünstigsten Fall aus: Wir haben ein Lightbox-Plugin, dessen Struktur nicht wirklich zu der eines üblichen jQuery Plugins in BlackCat CMS paßt, und wir wollen dieses Plugin als Lightbox verwenden. | Wir gehen jetzt mal von ungünstigsten Fall aus: Wir haben ein Lightbox-Plugin, dessen Struktur nicht wirklich zu der eines üblichen jQuery Plugins in BlackCat CMS paßt, und wir wollen dieses Plugin als Lightbox verwenden. | ||
Zeile 7: | Zeile 7: | ||
===== Schritt 1: Das Plugin installieren ===== | ===== Schritt 1: Das Plugin installieren ===== | ||
- | Das Plugin wird einfach von der Herstellerseite herunter geladen. Anschließend wird es unverändert über das Admin Tool "jQuery Plugin Manager" installiert. | + | Das Plugin wird einfach von der Herstellerseite herunter geladen. Anschließend wird das ZIP unverändert über das Admin Tool "jQuery Plugin Manager" hochgeladen und installiert. |
Es entsteht ein Verzeichnis ''ryrych-rlightbox2-1.1.1-0-g5d7c953'' mit folgenden Unterverzeichnissen und Dateien: | Es entsteht ein Verzeichnis ''ryrych-rlightbox2-1.1.1-0-g5d7c953'' mit folgenden Unterverzeichnissen und Dateien: | ||
Zeile 51: | Zeile 51: | ||
jquery.ui.widget.js | jquery.ui.widget.js | ||
jquery.ui.widget.min.js | jquery.ui.widget.min.js | ||
+ | |||
+ | (Stand 26.05.2014, bei späterem Download können Verzeichnisname und Inhalt abweichen.) | ||
| | ||
- | Der Download beinhaltet also alles, was das Plugin benötigt: Den jQuery Core, die jQuery UI und ein Theme. Die erste Herausforderung besteht also darin zu erkennen, welche Dateien wirklich geladen werden müssen, und welche überflüssig sind. | + | Der Download beinhaltet also alles, was das Plugin benötigt: Den jQuery Core (jquery-1.6.4[.min].js), die jQuery UI (jquery.ui.core[.min].js, jquery.ui.widget[.min].js) und ein UI Theme. Die erste Herausforderung besteht also darin zu erkennen, welche Dateien wirklich geladen werden müssen, und welche überflüssig sind. |
===== Schritt 2: Das Plugin in blackGallery hinzufügen ===== | ===== Schritt 2: Das Plugin in blackGallery hinzufügen ===== | ||
Zeile 76: | Zeile 78: | ||
Alle anderen Dateien werden also nun durch Anklicken des [-]-Symbols neben dem Eintrag entfernt. | Alle anderen Dateien werden also nun durch Anklicken des [-]-Symbols neben dem Eintrag entfernt. | ||
+ | |||
+ | ===== Schritt 4: Code zum Laden und Ausgabetemplate ===== | ||
+ | |||
+ | Der Code zum Laden steht auf der Hersteller-Homepage. | ||
+ | |||
+ | <sxh js> | ||
+ | jQuery(function($) { | ||
+ | $( ".lb_flowers" ).rlightbox(); | ||
+ | }); | ||
+ | </sxh> | ||
+ | |||
+ | Wir können den Namen der CSS-Klasse, die hier als Selektor verwendet wird, aber problemlos anpassen. Wir nehmen statt dessen ''lb_group'', weil das der gleiche Selektor ist wie bei der Slimbox. | ||
+ | |||
+ | <sxh js> | ||
+ | jQuery(function($) { | ||
+ | $( ".lb_group" ).rlightbox(); | ||
+ | }); | ||
+ | </sxh> | ||
+ | |||
+ | **Fertig!** | ||
+ | |||
+ | Wir brauchen in diesem Fall kein Ausgabetemplate, weil das Standardtemplate - das der Slimbox - paßt. | ||
+ | |||
+ | ===== Fazit ===== | ||
+ | |||
+ | Das Plugin wurde **unverändert** vom Hersteller übernommen, obwohl die Verzeichnisstruktur nicht zur Standard-Struktur von BlackCat CMS paßt. Das ist aber kein Problem, weil *.js und *.css-Dateien innerhalb der ersten 5 Verzeichnisebenen gefunden werden. Durch das Aussortieren der überflüssigen Dateien wird genau das geladen, was die blackGallery braucht. Im Frontend sollte die Galerie also jetzt auf Anhieb funktionieren, vorausgesetzt, sie hat vorher mit der Slimbox auch funktioniert. |