Es gibt einige Möglichkeiten das Aussehen und die Funktion der HTML Galerie zu ändern. Es kann nicht schaden wenn man sich vorher mit dem HTML-Generator des BreezeBrowsers vertraut macht. Die (englischen) Hilfeseiten sind online. Falls das Lesen der anschließenden Beschreibungen der Variablen zu mühsam ist, empfehle ich gleich die vier Beispielgalerien anzusehen. Die zeigen in Kürze was mit diesem Template alles möglich ist...
In dem Templatefolder "filmstrip" befinden sich 5 HTML-Dateien, einige GIF-Bilder und ein "readme" Textfile. Das Template kann ganz schnell angepasst werden indem man die Datei "index_template.htm" in einem Texteditor öffnet und die Werte der Variablen ändert, die in dem Bereich Customization gekennzeichnet sind:
indexMode = 0
Mit dieser Einstellung werden auf der Übersichtsseite automatisch zuerst alle querformatigen Bilder als Filmstreifen angezeigt, gefolgt von den hochformatigen in senkrechten Filmstreifen. Diese Variante sieht am realistischten aus. Auchtung: die Sortierreihenfolge kann sich natürlich von der im BreezeBrowser unterscheiden!
indexMode = 1
Wird diese Variable auf 1 gesetzt, dann werden alle Bilder auf der Übersichtsseite in horizontalen Filmstreifen angezeigt. Fotos im Hochformat werden hier in der Größe angepasst, sodass sie in den Filmstreifen passen. Das sieht zwar nicht so realistisch aus wie im vorigen Mode, aber dafür bleibt die Sortierreihenfolge erhalten. Eine weitere Anwendung wäre ein Endlosfilmstrifen, der in einem Frame angezeigt wird.
indexMode = 2
Setzt man die Variable auf 2 werden alle Bilder auf der Übersichtsseite in vertikalen Filmstreifen angezeigt. Es gelten die gleichen Vor- und Nachteile wie im vorigen Mode.
fullsizeMode = 0
Diese Variable legt fest welches Template für die Volldarstellung verwendet wird. Ist sie auf 0 gesetzt wird die Volldarstellung jedes Bildes in das gleiche Browserfenster geladen das auch die Übersichtsseite anzeigt. Das ist übrigens bei fast allen BreezeBrowser-Templates der Fall. Es wird die datei "fullsize_template.htm" verwendet, die jedoch leicht durch andere Volldarstellungs-Templates (aus anderen Templatefoldern) ersetzt werden kann. Wird diese Einstellung mit indexMode = 0 kombiniert, dann sollte man bedenken, dass ja die Reihenfolge der Bilder in der Volldarstellung nicht automatisch der auf der Übersichtsseite entspricht (wo die Bilder in Quer- und Hochformate getrennt angezeigt werden).
fullsizeMode = 1
Mit dieser Einstellung wird das Vollbild in einem Popup-Fenster angezeigt. Das neue Fenster richtet seine Größe automatisch nach der Bildgröße. Das Bild wird in einem Rahmen dargestellt. Weiters sind Links zum vorigen und nächsten Bild vorhanden sowie ein Link um das Fenster zu schließen. Die Bilderreihenfolge entspricht übrigens der der Übersichtsseite, sogar wenn indexMode = 0 gewählt wurde! Verwendet wird die Templatedatei fullsize2_template.htm.
fullsizeMode = 2
Die Variable sollte auf 2 gesetzt werden wenn man das "filmstrip" Template mit dem "frames" Template kombinieren will. Man muss dazu nur eine Datei umbenennen und kopieren. Im Beispiel 4 wird dieser Fall näher betrachtet. Bei diese Einstellung sollte die Variable indexMode auf 1 oder 2 gesetzt werden.
numColumns = 5
Hier kann man die maximale Bildanzahl pro horizontalem Filmstreifen definieren. Bei obigem Beispiel wird nach jedem fünften Bild ein neuer Filmstreifen begonnen. Für einen Endlos-Streifen muss man diesen Wert größer als die maximale Bildanzahl in der Galerie setzen (z.B. 1000).
numRows = 4
Gleich wie numColumns (siehe oben), aber für die senkrechten Filmstreifen.
invert = 1
Wird diese Variable auf 1 gesetzt, dann werden die Thumbnails als "Negative" angezeigt. Fährt man mit der Maus über das Bild werden die echten Farben dargestellt. Dieser Effekt funktioniert allerdings nur beim MS Internet Explorer.
invert = 0
Die Bilder auf der Übersichtsseite werden normal (unverändert) dargestellt.
shadow = 0
Ändert man die Templates so, dass ein farbiger Hintergrund oder ein Hintergrundbild dargestellt wird, dann sollte die shadow-Variable auf 0 gesetzt werden (kein Schatten). In diesem Fall werden die Löcher im Filmstreifen transparent angezeigt, damit die Hintergrundfarbe/-grafik durchscheinen kann.
shadow = 1
Mit dieser Einstellung wird ein schwarzer Schatten (auf weißen Hintergrund) rechts und unterhalb der Bilder angezeigt. Dies gilt sowohl für die Übersichtsseite als auch für die Volldarstellung, wenn fullsizeMode = 1 gewählt wurde (Popups). Die Schattenanzeige sollte nur bei einem weißem Hintergrund (default) angewendet werden.
shadow = 2
Wenn man den Hintergrund schwarz oder dunkelgrau wählt, dann sollte diese Variable auf 2 gesetzt werden. Jeder Filmstreifen wird dann mit einem weißem Schein angezeigt um ihn vom Hintergrund abzuheben. Bei der Einstellung fullsizeMode = 1 (Popups) wird auch das Vollbild in einem weißem Rahmen angezeigt.
Das waren einfache Möglichkeiten das Template anzupassen. Man mus dazu nur wissen wie man eine HTML-Datei in einem Texteditor ändern kann: nicht doppelklicken, sondern über das Rechte-Maus-Menü "öffnen mit..." wählen (und einen Texteditor angeben) oder das HTML-File einfach mit Drag&Drop in einen offenen Texteditor ziehen.
Mit etwas HTML-Grundwissen kann man weitere Anpassungen in den Templates durchführen, wie z.B. Hintergrundfarbe, Schriftart und -größe ändern, ein Logo oder zusätzlichen Text hinzufügen. Die folgenden Beispiele zeigen ein paar Ideen.
|