DE

Headerslider

Ein Inhaltselement für Einstiegsseiten

Der Headerslider platziert ein Bild großflächig am oberen Rand der Seite. Durch Anklicken von Pfeilen neben dem Bild kann der Nutzer das nächste Bild aufrufen.

Weil der Headerslider sehr viel Raum einnimmt, eignet er sich nur für Einstiegsseiten/"Landing Pages" oder Seiten, für die dieses Format sinnvoll ist.

Erstellen Sie ein neues Inhaltselement und wählen Sie dabei das Modul "Headerslider" aus.

Der Headerslider besteht aus großen Bildelementen sowie einem Textabschnitt mit Überschrift.

  1. Fügen Sie zunächst die Überschrift hinzu.
  2. Setzen Sie hier den Text ein. Der Text sollte nicht zu lang werden, max. 500-600 Zeichen werden empfohlen.
  3. Für das erste Bild des Sliders klicken Sie hier.

 

 

  1. Klicken Sie auf das Ordnersymbol. Sie sehen dann die Dateiliste. Wählen Sie dort das erste Bild für den Slider aus. Eine Bildbreite von 2190px ist empfehlenswert.
  2. Die Bildreferenz des geladenen Bildes wird dann automatisch hier eingeblendet.
  3. Vergeben Sie den Alternativtext des Bildes.
  4. Klicken Sie hier, um dem Slider das nächste Bild hinzuzufügen.

 

  1. Über diesen Link haben Sie weitere Optionen für das eingebundene Bild. Sie können sich z.B. eine Vorschau des Bildes ansehen.
  2. Wenn, so wie hier, bereits mehrere Bilder für den Slider eingebunden wurden, dann erhält jedes Bild einen Eintrag, der aufgeklappt oder geschlossen werden kann.
    Tipp: Über den Menübutton (hier direkt unter der 2) können Sie das Bildelement anklicken und ziehen, um so die Reihenfolge der Bilder zu ändern.
  3. Mit diesem Button können Sie alle Bildelemente gleichzeitig ein- und ausklappen.
  4. Klicken Sie hier, um dem Slider ein weiteres Bild hinzuzufügen.

Tipp

Der Bildauschnitt, der auf der Webseite angezeigt wird, passt sich automatisch an die Größe Ihres Bildschirms an (Stichwort responsives Design). Für eine optimale Desktop-Ansicht auf großen Bildschirmen empfiehlt sich ein Bild, auf dem das Motiv möglichst mittig platziert ist.

TUHH Gebäude A
Baum

Dies ist ein Headerslider

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.