Dokumentation

coinSlider

Eine jQuery Slideshow für moziloCMS

Funktionalität

Das coinSlider Plugin generiert eine navigierbare Slideshow mit verschiedenen Effekten aus Bildern einer in moziloCMS vorhandenen Galerie.

Vorraussetzungen

Folgende Vorraussetzungen sind für das coinSlider Plugin notwendig:

• moziloCMS ab Version 2.0
• Aktiviertes Javascript im Browser

Download

coinSlider-master.zip [~33 KB]

Installation

moziloCMS Installer

Das Plugin kann im moziloCMS Backend unter Plugins installiert werden. Dazu die gepackte Plugindatei auswählen (.zip-Datei mit exakt dem gleichen Namen wie das Plugin selbst) und mit Install bestätigen. Das jetzt aufgeführte coinSlider Plugin kann nun aktiviert und konfiguriert werden.

Manuell

Zur manuellen Installation des Plugins, wird ein Serverzugang wie FTP oder SSH benötigt.

• Die .zip-Datei entpacken und den Ordner coinSlider in das Pluginverzeichnis: <moziloroot>/plugins/ von Mozilo hochladen.
• Ordner- und Dateirechte (chmod) auf 777 für Ordner und 666 für Dateien setzen.
• Im Backend unter Plugins das jetzt aufgeführte coinSlider Plugin aktivieren und die gewünschte Konfiguration setzen.

Pluginsyntax

{coinSlider|<name>|<width>|<height>|<spw>|<sph>|<delay>|<sDelay>|<opacity>|<titleSpeed>|<effect>|<navigation>|<links>|<hoverPause>}

Gibt den coinSlider zurück.

1. Parameter <name>: Der Name einer in mozilCMS existierenden Galerie. Wird ein falscher oder kein Name angegeben, gibt das Plugin eine Meldung aus.
2. Parameter <width>: Die Breite der Slideshow in Pixeln (z.B. 500).
3. Parameter <height>: Die Höhe der Slideshow in Pixeln (z.B. 200).
4. Parameter <spw>: Quadrate pro Breite (Anzahl von animierten Quadraten über die Breite des Sliders, z.B. 10)
5. Parameter <sph>: Quadrate pro Höhe (Anzahl von animierten Quadraten über die Höhe des Sliders, z.B. 4)
6. Parameter <delay>: Anzeigedauer eines Bildes (Zeit in Millisekunden, die ein Bild angezeigt wird, z.B. 3000)
7. Parameter <sDelay>: Anzeigedauer der Quadrate (Zeit in Millisekunden, die ein einzelnes Quadrat beim Bildwechsel angezeigt wird, z.B. 300)
8. Parameter <opacity>: Transparenz von Beschreibung und Navigation (Ein Wert zwischen 0.0 und 1.0 zur Beschreibung der Transparenz der Bilduntertitel und der Naviagionspfeile)
9. Parameter <titleSpeed>: Erscheinungsdauer der Beschreibung (Zeit in Millisekunden, die der Bilduntertitel braucht, um zu erscheinen, z.B. 500)
10. Parameter <effect>: Überblendeffekt - Legt den Effekt fest, mit dem zwischen Bildern gewechselt wird. Mögliche Werte sind:
    • random: Zufällige Reihenfolge der Quadrate beim Überblenden
    • swirl: Quadrate blenden in Schneckenform über
    • rain: Quadrate blenden in einer Diagonalen über
    • straight: Quadrate blenden zeilenweise über
11. Parameter <navigation>: Navigation anzeigen (Legt fest ob die Navigationspfeile und -buttons anzeigen). Mögliche Werte sind true oder false.
12. Parameter <links>: Bilder als Verweis setzen (Legt fest, ob Bilder auf sich selbst verlinken oder nicht). Mögliche Werte sind true oder false.
13. Parameter <hoverPause>: Beim Maushover anhalten (Legt fest, ob der Slider bei Maushover anhält). Mögliche Werte sind true oder false.

Hinweis

Optimale Anzeige erreicht man, wenn die Größe des Sliders exakt mit der der in der Galerie befindlichen Bilder übereinstimmt!

Sind die Effekte mit mehreren Quadraten, welche nacheinander faden, nicht erwünscht, so kann bei Quadrate pro Breite und Quadrate pro Höhe einfach eine 1 notiert werden. Damit faden die kompletten Bilder direkt ineinander über. Evt. muss dann die Anzeigedauer der Quadrate angepasst werden.

Achtung

Zu viele Quadrate können die Performance der Übergänge beeinträchtigen.

Administratoreinstellungen

Folgende Administratoreinstellungen sind für dieses Plugin möglich:

Button Label

• Vorheriges Bild: Hier kann das Label für den Rückwärtsnavigation gesetzt werden.
• Nächstes Bild: Hier kann das Label für den Vorwärtsnavigation gesetzt werden.

Beispiel 1

{coinSlider|@=coinslidertest=@|499|283|6|3|3000|30|0.7|500|rain|true|true|true}

Ausgabe:

Lizenz

Das Plugin steht unter der GNU General Public License (GPL) v3, oder frei nach Wahl jede folgende Version. Jegliche Hinweise auf Autor und Urheber müssen erhalten bleiben.

Sonstiges

Quellen

Das Plugin basiert auf dem Coin Slider: Image Slider with Unique Effects Projekt von Ivan Lazarevic. http://workshop.rs/2010/04/coin-slider-image-slider-with-unique-effects https://github.com/kopipejst/coin-slider

Bildquelle für Beispielbild:
http://www.n24.de/n24/Mediathek/Bilderserien/d/303040/futuristisches-auf-der-iaa.html?index=14

Sprachen

Frontend: Deutsch, Englisch
Backend: Deutsch, Englisch

---

Falls dir dieses Plugin gefällt — ich freue mich immer über eine kleine Unterstützung: