(Opens in a new window - öffnet in einem neuen Fenster)

Kurz-Dokumentation Plugin "MultiMediaSlider"

Version MultiMediaSlider 1.3 - released 10/2026

MultiMediaSlider ist ein CMSimple Plugin, mit dem Bilder, Videos und html Code in einem Slider dargestellt werden können Es basiert auf dem jQuery Plugin Fotorama » - vielen Dank an Artem Polikarpov für die freie Bereitstellung des Scriptes unter MIT Lizenz.

!!! Bitte beachten Sie Urheberrechte und CopyRights der Audio- und Videodateien !!!

Die im Download verwendeten Bilder sind frei verwendbar, dürfen jedoch nicht verändert oder bearbeitet werden.

1. Systemvoraussetzungen

Funktionierende Installation von CMSimple 4.2 oder höher, empfohlen wird die aktuelle Version von CMSimple »
Aktiviertes jQuery 1.8.3 oder höher

2. Installation

zip-Datei herunterladen und mit einem geeigneten Programm entpacken
- Laden Sie die komplette Ordner-Struktur des Verzeichnisses "CMSimpleRoot" (die Verzeichnisse "plugins", "content" und "userfiles") in das Installationsverzeichnis von CMSimple hoch.
- Ihr ftp Programm wird merken, dass es diese Verzeichnisse bereits gibt, und Sie fragen, ob Sie das wirklich tun wollen. Beantworten Sie diese Frage einfach mit "ja", "ok" oder was immer Ihr ftp Programm anbietet.
- Bei einem Update laden Sie einfach die Verzeichnisse "content" und "userfiles" nicht mit hoch.
Vergeben Sie, wenn nötig, mit Ihrem ftp-Programm die erforderlichen Lese- und Schreibrechte für Ordner und Dateien.

Vor einem Update erstellen Sie unbedingt eine Sicherheitskopie des alten Plugins, damit Sie eventuelle Änderungen/Ergänzungen am Stylesheet, der Konfiguration und den Sprachdateien wieder herstellen können.

3. Datei- und Ordnerrechte

Damit das Programm funktioniert und arbeiten kann (bzw. administrierbar ist), müssen auf älteren Servern für bestimmte Dateien und Ordner bestimmte Schreib- und Leserechte vergeben werden. Auf den meisten modernen Servern ist das heute nicht mehr erforderlich.

Dateien: chmod 666

./plugins/multimediaslider/languages/alle Dateien
./plugins/multimediaslider/config/config.php
./plugins/multimediaslider/css/stylesheet.css
./content/plugins/multimediaslider/alle Dateien

Ordner: chmod 777

./plugins/multimediaslider/languages/
./userfiles/plugins/MultiMediaSlider/
./content/plugins/multimediaslider/

4. Die Plugin Aufrufe

Im Inhalt:

{{{plugin:mmslider('Dateiname');}}}

Im Template:

<?php echo mmslider('Dateiname'); ?>

Dateiname: Der Name der Datei ohne Dateiendung. Die verfügbaren Slider Dateien finden Sie unter
./content/plugins/multimediaslider/

Das Plugin ist so einfach zu bedienen, dass hier weiter keine Erläuterungen notwendig sein sollten.

Für versierte Anwender gibt es eine ausführliche Dokumentation auf der Fotorama Website »

5. Subsites und Zweitsprachen

Die Datendateien

Die Datendateien der Slider werden immer im in der Konfiguration festgelegten Ordner erwartet, Standard ist:

./content/plugins/mutlmediaslider/

In Subsites oder Zweitsprachen muss dieser Ordner erst angelegt oder aus der Hauptseite / Hauptsprache kopiert werden.

Aus der Hauptseite in Subsites oder Zweitsprachen kopierte Slider funktionieren nur, wenn auch die Bilderordner und die Bilder im Ordner

userfiles/plugins/MultiMediaSlider/

in die jeweilige Subsite oder Zweitsprache kopiert werden, sonst müssen die Referenzen der Bilder angepasst werden, z. B.

./ => ../ oder ../../

Die Bilderordner

Das Plugin kann Bilder und andere Ressourcen von überall her verwenden. Im Backend wird jedoch vom Normalfall ausgegangen. Normalerweise liegt der Bilderordner im userfiles Ordner der Hauptseite oder der jeweiligen Subsite oder Zweitsprache:

./userfiles/plugins/MultiMediaSlider/

Wenn in der Subsite oder Zweitsprache kein entsprechender Ordner existiert, arbeitet das Plugin mit dem Bilderordner der Hauptsprache.

Die Bilder können auch in Unterverzeichnissen des Bilderordners organisiert werden.

6. Neue Funktionen ab Version 1.3

(Oktober 2026)

Fotorama Slideshows stoppen bei entsprechender Konfiguration bei einer beliebigen Aktion im Slider, z. B. bei Klick in den Slider (mit einem Bildwechsel verbunden) oder beim Klick auf eines der Vorschaubilder. Eine erneute Aktivierung der Slideshow ist nur durch neuladen der Seite möglich.

Wenn man mehrere Slider auf der Seite hat, gehen die beim neuladen der Seite alle wieder los. Das kann nerven, und auch aus anderen Gründen können mehrere Slider auf einer Seite problematisch sein. Hier schafft die neue Funktion "Controls" Abhilfe.

Betriebsart "Controls": Start- und Stopbutton

Diese Funktion erstellt einen Tab mit Start- und Stopbutton oberhalb des Sliders. Mit diesen Buttons kann die Slideshow für jeden einzelnen Slider gestoppt und wieder gestartet werden. Ausserdem kann der Slider inaktiv in die Seite eingefügt werden, so dass er erst startet, wenn der Besucher den Startbutton anklickt.

Das ist vor allem vorteilhaft bei mehreren Slidern auf einer Seite, da diese unabhängig voneinander gesteuert werden können.

So sieht die Datendatei eines Sliders mit Controls aus:

[[div class="mmsl_dark control_buttons"]]

[[div class="fotorama__controls" style="background: none;"]]
[[div class="fotorama__prevbutton"]] « [[/div]]
[[div class="fotorama__startbutton"]] [[/div]]
[[div class="fotorama__stopbutton"]] [[/div]]
[[div class="fotorama__nextbutton"]] » [[/div]]
[[/div]]

[[div class="fotorama"
... die Konfigurationsoptionen
]]

... die Bilder

[[/div]]
[[/div]]

Auf "normal konfigurierten" Servern geht auch <...> anstelle von [[...]]

Betriebsart "Stop bei mouseover"

Diese Funktion bewirkt, dass der Slider bei mouseover (hover) stoppt und bei mouseout (mouseleave) weiterläuft. Ausgelöst wird dieses Verhalten durch eine weitere Klasse im fotorama Bereich der Datendatei des Sliders:

...
[[div class="fotorama control_mouseover"
...

Auf "normal konfigurierten" Servern geht auch <...> anstelle von [[...]]

Nachteil: Diese Slider können nicht dauerhaft abgeschaltet werden, weil es bei mouseout einfach weitergeht. Diese Funktion ist also nicht geeignet bei mehreren Slidern auf einer Seite.

Sonderfunktion: Stop bei mouseover für alle Slider

Diese Funktion stellt ALLE Slider auf "Stop bei mouseover" um.

Ist diese Funktion aktiviert, sind die beiden anderen Funktionen (controls und mouseover by class) automatisch deaktiviert, da es sonst zu Konflikten kommen kann. Sie ist eigentlich nur für Anwender gedacht, die schon sehr viele Slider zu laufen haben und nun eine einfache Lösung suchen, diese Slider auf "Stop bei mouseover" umzustellen, ohne jeden einzelnen Slider bearbeiten zu müssen.

Diese Funktion kann in der Plugin Konfiguration aktiviert werden.

Nachteil: Die Slider können nicht dauerhaft abgeschaltet werden, weil es bei mouseout einfach weitergeht. Diese Funktion ist also nicht geeignet für mehrere Slider auf einer Seite.

7. Neuen Slider aus Vorlage erzeugen

Die Datendateien der Slider finden sie im Adminmenü unter:

Plugins => multimediaslider => Slider bearbeiten

Per Auswahlbox können Sie nun den Slider auswählen, den Sie bearbeiten wollen.

In dieser Auswahlbox finden Sie auch die Standard-Vorlagen, sie beginnen mit zzz_ und sollten nicht verändert werden.

Vorlagen, die mit _buttons enden, erzeugen einen Slider mit Controls (Start- und Stopbutton).
Vorlagen, die mit _mouseover enden, erzeugen einen Slider mit "Stop bei mouseover".
Alle anderen Vorlagen erzeugen einen Slider mit Standardverhalten.

Sie können diese Vorlagen aufrufen und auf der Grundlage der gewählten Vorlage einen neuen Slider erstellen.

Sie können aber auch einen Ihrer eigenen Slider als Vorlage verwenden.

8. Slider bearbeiten und stylen

Die Datendateien der Slider können im Adminbereich bearbeitet werden, Sie finden sie im Adminmenü unter:

Plugins => multimediaslider => Slider bearbeiten

Per Auswahlbox können Sie nun den Slider auswählen, den Sie bearbeiten wollen.

Der Container - mit Klassen für Styling und Funktion

Die 1. Zeile der Vorlagen enthält den öffnenden div-Tag des Containers, dieser enthält 1 oder mehrere Klassen:

[[div class="mmsl_dark control_buttons" style="background: #111;"]]
...

Auf "normal konfigurierten" Servern geht auch <...> anstelle von [[...]]

mmsl_dark: Designklasse, folgende Standardklassen sind enthalten: mmsl_dark, mmsl_gray und mmsl_light.
Wenn Sie diese Designklasse weglassen, bekommen Sie einen ungestylten Slider.
control_buttons: Funktionsklasse, für einen Slider mit Controlbar (Start, Stop usw.)
Wenn diese Klasse fehlt, funktionieren die Elemente der Controlbar nicht, auch wenn sie vorhanden sind.
Dieser Tag kann auch noch mit Inline CSS erweitert werden, wie im Codebeispiel zu sehen.

Bei Slidern mit Controlbar folgt als nächstes der Codeblock für die Controlbar:

[[div class="mmsl_dark control_buttons" style="background: #111;"]]

[[div class="fotorama__controls" style="background: none;"]]
[[div class="fotorama__prevbutton"]] « [[/div]]
[[div class="fotorama__startbutton"]] [[/div]]
[[div class="fotorama__stopbutton"]] [[/div]]
[[div class="fotorama__nextbutton"]] » [[/div]]
[[/div]]
...

Auf "normal konfigurierten" Servern geht auch <...> anstelle von [[...]]

In der 1. Zeile dieses Codeblocks sorgt die Klasse fotorama__controls für Layout und Design der Controlbar. Auch dieser Tag kann mit Inline CSS erweitert werden, wie im Codebeispiel zu sehen.

Danach folgt der Code für die eigentliche Fotorama Slideshow mit der Konfiguration und den Bildern:

Auf "normal konfigurierten" Servern geht auch <...> anstelle von [[...]]

Auch hinter [[div class="fotorama" kann, so wie im Codebeispiel, Inline CSS geschrieben werden.