Shift-Image-Header
Achtung: Beachten Sie, dass bei der Darstellung des Headers die Festlegungen unter Morepagedata_XH (unten der Reiter Mehr) Vorrang vor den in der Konfiguration getätigten Einstellungen haben! Überzeugen Sie sich also, dass für die aktive Seite, unter der die Konfiguration vorgenommen wird, bei den Einstellungen unter Mehr keine Einstellungen bezüglich des Headers erfolgt sind! Am einfachsten ist das zu erreichen, wenn man vor der Konfiguration des Templates eine neue leere Seite erstellt und diese zur aktiven Seite macht.
Header mit Logo & Mottotext vor Hintergrundshiftimage
Für diesen Header wird ein sehr breites Bild benötigt!
Im Hintergrund läuft dieses sehr breite Bild von rechts nach links endlos durch (Bildhöhe am besten 300 Pixel, Bildbreite mehr als 4000 Pixel).
Nach meiner Erfahrung kann man dazu aus einem der sehr großen Bilder, die es in vielen Bildportalen gibt, einen 300 Pixel hohen Streifen herauskopieren,
oder man nimmt eine Panorama-Aufnahme, wie man sie mit moderneren Handys selbst anfertigen kann. Eine weitere Möglichkeit wäre mit geeigneten Tools aus verschiedenen Bildern eine passende Collage zusammenzustellen.
Für das durchlaufende Bild wird kein JS eingesetzt! Das Bild wird mittels einer CSS-Formatierung endlos nach links verschoben.
Das Bild muss im Ordner ./userfiles/images oder einem Unterordner davon liegen. Der Ordner wird über eine Drop-Down-Liste ausgewählt.
Das Bild wird dann über eine zweite Drop-Down-Liste ausgewählt. In dieser Liste erscheinen nur Dateien mit einer der folgenden Erweiterungen: bmp gif jp2 jpg png tif tiff webp svg
Ist das Bild höher als 300 Pixel wird ein ca. 300 Pixel hoher Streifen aus der Bildmitte angezeigt. Wenn das Bild nicht breit genug ist, wird es aufgezoomt, dabei gehen aber wieder Teile der Bildhöhe verloren. Das bedeutet: falsche Bildabmessungen zerstören zwar nicht das Layout, sie führen jedoch zu unschönen Effekten.
Hinweis: Das Hintergrundbild wird erst dann richtig dimensioniert angezeigt, wenn zumindest einmal die Schiebegeschwindigkeit neu eingestellt wurde. Das hängt damit zusammen, dass die Parameter für die CSS-Formate erst dann fehlerfrei berechnet werden, wenn alle notwendigen Angaben definiert wurden.
Die Geschwindigkeit, mit der das Hintergrundbild durchläuft, kann zwischen 10 und 200 Pixeln pro Sekunde eingestellt werden. Bei Werten unter 20 Pixel/Sekunde kann das Bild zu ruckeln beginnen, bei Werten über 100 Pixel/Sekunde kann einem Betrachter schwindlig werden. Auf Basis der gewählten Geschwindigkeit und der Bildbreite ergibt sich die Zeit für einen kompletten Durchlauf. Diese Zeit wird angezeigt.
Vor dem Hintergrundbild wird links oben ein Logo und rechts oben der Motto-Text angezeigt (wenn die entsprechenden Festlegungen getroffen sind).
Beide werden mit einer transparenten Farbhinterlegung versehen.
Die Logo-Datei muss sich im Images-Ordner des Templates oder einem der Ordner unter ./userfiles/images befinden.
Die Logo-Grafik wirkt am besten, wenn es eine Grafik mit transparentem Hintergrund ist.
Dann kann das Hintergrundbild durch die transparent Farbhinterlegung durchscheinen.
Ausgewählt wird das Logo über eine Drop-Down-Liste der Ordner und eine zweite Liste der Dateien.
Es ist allerdings auch möglich "- show no logo -" auszuwählen, um kein Logo anzuzeigen (dann wird auch keine Farbhinterlegung ausgegeben).
Das Logo wird automatisch herunterskaliert (max. Breite: 576 Pixel, max. Höhe: 242 Pixel).
Damit jedoch nicht unnötig große Bilder übertragen werden müssen, ist es sinnvoll, die Logo-Grafik in der Größe annähernd anzupassen.
Der Motto-Text ist auf max. 1152 Pixel Breite begrenzt, das entspricht etwa 50-51 Zeichen.
Wird kein Text eingegeben, wird auch die Farbhinterlegung des Textes nicht angezeigt.
Ist der Text so lang, dass er nicht mehr in eine Zeile passt, wird er automatisch umgebrochen.
Einen willkürlichen Zeilenumbruch erreicht man durch Eingabe des senkrechten Striches (| = AltGr + <) oder <br>.
Einfache (′) oder doppelte (″) Anführungszeichen werden automatisch in ihre HTML-Entitäten ' und " umgewandelt.
Der Motto-Text kann bis zu 6 Zeilen hoch sein. Ab der siebten Zeile verdrängt er die Brotkrümelnavigation nach unten.
Die Textfarbe des Motto-Textes kann frei eingestellt werden oder die Akzentfarbe kann durch Knopfdruck übernommen werden.
Sowohl Logo als auch der Motto-Text werden mit einer frei wählbaren Farbe hinterlegt, deren Transparenzgrad einstellbar ist.
Der Eckradius dieser Farbhinterlegung kann ebenfalls eingestellt werden.
