Entpacken Sie die .zip Datei mit einem geeigneten Programm.

Legen Sie einen Ordner "shutter_mobile" im Root Ihrer Domain an und laden Sie die Dateien shutter_mobile.js und shutter_mobile.css sowie den Ordner "images" aus dem Download in diesen Ordner hoch.

Dann schreiben Sie folgendes zwischen </title> und </head> in Ihre html Datei oder Ihr Template (in dieser Reihenfolge):

<script>
shutterOnload = function(){shutterMobile.Init();}
</script>
<script src="/shutter_mobile/shutter_mobile.js"></script>
<link rel="stylesheet" href="/shutter_mobile/shutter_mobile.css">

Eigentlich ist ShutterMobile jetzt schon fertig installiert.

Alternatives shutterOnload

Wenn Sie nicht wollen, dass JEDES verlinkte Bild in einer Lightbox geöffnet wird, fügen Sie dem JavaScript Aufruf von shutterOnload im head Bereich der Seite ein 'sh' zwischen den Klammern hinzu:

<script>
shutterOnload = function(){shutterMobile.Init('sh');}
</script>

Dann werden nur Bilder, die mit der Klasse "shutter" verlinkt sind, in einer Lightbox geöffnet:

<a href="path/to/grosses_bild.jpg" class="shutter">
<img src="path/to/kleines_bild.jpg" alt="Bild">
</a>

Mehr über die Kontrolle der Lightbox, Slideshows für Bilderserien usw. erfahren Sie im Bereich Anwendung » dieser Dokumentation.

nach oben