In diesem Beitrag zum Thema Joomla Slideshow wird erklärt, was Silder sind, wie sie funktionieren und wie man einen Slider mit Hilfe von sketch.slider in eine Joomla Seite einbaut.
Was ist eine Joomla Slideshow?
Eine Slideshow in Joomla ist eine Funktion, die verschiedene Bilder auf einer Position anzeigen lassen kann. Das Wechseln (sliden) der Bilder geschieht in diesem Fall automatisch. Die zu wechselnden Bilder werden zuvor in einer Komponente (z.B. sketch.slider) festgelegt.
Die Ausgabe einer Slideshow wird in Joomla in der Regel durch ein in der Komponente enthaltenes Modul geregelt.
Wie funktioniert eine Joomla Slideshow?
Da der Grundgedanke bei einem Joomla Slider ein optisch ansprechender Wechsel zwischen den Bildern ist, stößt man mit den Standards HTML und CSS schnell an seine Grenzen. Um die gewünschten Effekte beim Wechsel der Bilder zu erreichen, benötigt man die Java-Script-Bibliothek jQuery.
jQuery bringt alle Funktionen mit, die benötigt werden, um eine Joomla Slideshow zu erstellen. Die jQuery Bibliothek wird nativ von Joomla unterstützt. Somit ist hier keine zusätzliche Installation erforderlich.
Einrichten einer Joomla Slideshow mit sketch.slider
Im Folgenden wird erklärt, wie die Einrichtung einer Joomla Slideshow mit der Komponente sketch.slider funktioniert. Die sketch.slider Komponente ist HIER kostenlos erhältlich. Wie man eine Komponente in Joomla installiert, wird HIER ausführlich beschrieben.
Konfigurieren vom sketch.slider
Nach der erfolgreichen Installation von sketch.slider findet man im Hauptmenü des Joomla-Backends unter "Komponenten" den Punkt sketch.slider. Hier werden die Kategorien und die einzelnen Bilder (Slides) der Joomla Slideshow angelegt.
In der oberen rechten Ecke befindet sich der Optionen-Button. Hier kann das grundlegende Design und Verhalten der Joomla Slideshow festgelegt werden. Neben der Farbgebung der Schrift und der Slider-Box können hier folgende Einstellungen vorgenommen werden:
- Bild Navigation: Möglichkeit, eine Punktnavigation zum direkten Anwählen der Slides anzuzeigen
- Pfeil Navigation: Anzeige von Pfeilen am Rand der Slides zum Vor- bzw Zurücknavigieren
- Effekt beim Bildwechsel: Auswahl der Art der Animation beim Wechsel der Bilder
- Dauer: Angabe des Zeitraums für die Anzeige eines Bildes in ms (1000 = 1 Sekunde)
Falls man mehrere Joomla Slideshows auf einer Webseite anlegen möchte, benötigt man eine Zuweisung der einzelnen Slides/Bilder in Kategorien. Die sketch.slider Komponente arbeitet hier mit der Joomla nativen Kategorisierung. Um eine Kategorie für eine Slideshow anzulegen, klickt man innerhalb der sketch.slider Komponente in der linken Menü-Leiste auf den Punkt Kategorien.
Das Anlegen und Verwalten der Kategorien funktioniert wie in allen anderen Joomla-Bereichen (z.B. Inhalte) und wird hier nicht ausführlich erklärt.
Anlegen einer Joomla Slideshow mit sketch.slider
Mit einem Klick auf "Neuen Slider anlegen" in der linken Menüleiste der sketch.slider Komponente öffnet man die Maske zum Anlegen einzelner Slides. In dieser Maske gibt es folgende Felder:
- Kategorie: hier wird die zuvor erstellte Kategorie ausgewählt, der das Bild zugewiesen werden soll
- Veröffentlichung: aktiviert bzw. deaktiviert die Ausgabe des Bildes
- Titel: hier wird der Name des Slides festgelegt
- Sortierung: Reihenfolge, in der die Bilder in der Joomla Slideshow ausgegeben werden sollen (optional)
- Überschrift: wird bei der Ausgabe im Frontend über das Bild gelegt (optional)
- Beschreibungstext: Möglichkeit, dem jeweiligen Slide einen beliebigen Text hinzuzufügen (optional)
- Link: hier kann ein Link hinterlegt werden, der beim Klick auf den Slide aufgerufen wird (optional)
Ausgabe der Joomla Slideshow im Frontend der Webseite
Nachdem die Joomla Slideshow im Backend der Webseite konfiguriert und vorbereitet wurde, kann man ein Modul für die Ausgabe im Frontend anlegen. Das Anlegen des Modules für die Joomla Slideshow erfolgt wie gewohnt in der Joomla nativen Modul Verwaltung. Hier öffnet man mit einem Klick auf den Neu-Button die Übersicht der im Joomla System installierten Module. In dieser Übersicht wird der Punkt sketch.slider Modul ausgewählt.
In der folgenden Eingabemaske muss eine zuvor angelegte Slider Kategorie ausgewählt und eine Modulposition zugewiesen werden. Die Modulposition kann sowohl eine im Template vorgegebene Position sein, als auch eine benutzerdefinierte Position, die mit dem {loadposition} Befehl an jeden beliebigen Ort im Inhalt der Webseite eingefügt werden kann.