Der verkleinerte Header ist eine kleinere Version des Website-Headers. So können Sie in geringerer Größe wichtige Hinweise zur Navigation in fixierter Position anzeigen, ohne dass Benutzer beim Scrollen auf der Seite abgelenkt werden. Die Funktion entspricht der eines angehefteten Headers. Die Größe der Logos und anderen s im Header wird reduziert. Dieses Feature ist besonders nützlich auf Websites mit großen Headern und Websites mit langen Abschnitten zum Scrollen.
Der Shrinking-Header ist auf dem Desktop verfügbar und nur auf dem Tablet, wenn das Header-Layout der oberen Leiste verwendet wird.
Wenn der Benutzer über die Höhe des Headers hinaus gescrollt hat, wird dieser verkleinert.
- Wenn Spalten ein sichtbares enthalten, so ist das vertikal zentriert in der Spalte positioniert. Die oberen und unteren Abstände und Ränder sind auf 0 festgelegt.
- Wenn Spalten mehr als ein sichtbares enthalten, sind diese s nicht vertikal ausgerichtet. Die oberen und unteren Abstände und Ränder sind auf 10 Pixel festgelegt.
- Wenn leere Zeilen mit Spalten vorhanden sind, nehmen die Spalten den gesamten Raum der Zeile ein.
- Für die Verarbeitung von Vorlagen mit einem Wert für die Mindesthöhe im Header wird die Mindesthöhe des Headers auf „automatisch“ festgelegt.
So bearbeiten Sie das Design eines verkleinerten Headers:
- Fahren Sie mit der Maus über den Header, klicken Sie auf Header und dann auf Design bearbeiten.
- Schalten Sie auf der Registerkarte „Verkleinerter Header“ den Schalter Verkleinerter Header aktivieren um. Sie haben folgende Optionen:
- Nur Navigationszeile anzeigen. Zeigen Sie die Navigationszeile nur dann an, wenn der Header verkleinert wird. Diese Funktion kann nur verwendet werden, wenn der Header mehr als eine Zeile umfasst.
- Hintergrundfarbe. Ändern Sie die Hintergrundfarbe des verkleinerten Headers. Beachten Sie, dass durch die Zeilenhintergrundfarbe die Hintergrundfarbe des verkleinerten Headers überschrieben wird.
- Mehr Header-Farben beim Scrollen. Legen Sie Farben für den Text, den ausgewählten Link & Hover, Symbole, Schaltflächen-Text und mehr fest.
- Logogröße. Legen Sie die Größe fest, auf die das Logo oder Bild beim Verkleinern des Headers reduziert werden soll (Standardwert: 66 %).
- Logo beim Scrollen ändern. Wählen Sie ein Logo aus, das beim Scrollen angezeigt werden soll.
- Header-Abstände. Passen Sie die oberen und unteren Abstände des verkleinerten Headers an. Sie können den Header-Abstand gerätespezifisch festlegen.
Aktionen bei Aktivierung des verkleinerten Headers:
- Die Website scrollt nach unten, um das verkleinerte Header-Logo und dessen Wirkung anzuzeigen.
- Die Anheftfunktion wird automatisch auf den Header angewendet.
- Durch die Abstandseinstellungen des Headers werden die inneren Abstände und Ränder oben und unten auf 0 geändert.
Beachten Sie, dass dadurch nur die inneren Abstände und Ränder des Headers, nicht jedoch die der Zeilen des Headers geändert werden.
- Bilder im Header werden auf die Einstellung des Reglers für die prozentuale Logogröße verkleinert (Standardeinstellung: 66 %).
- Änderungen des Header-Layouts wirken sich nicht auf die Einstellungen des verkleinerten Headers aus.
- Nicht alle s sind kompatibel und werden im verkleinerten Header angezeigt. Im verkleinerten Header werden nur die folgenden s angezeigt:
- Navigation
- Widget für mehrere Sprachen
- Social Media-Symbole
- Click-to-Call-Schaltfläche
- OpenTable-Schaltfläche
- Click-to-Email-Schaltfläche
- vCita
- PayPal-Schaltfläche
- „Gefällt mir“-Schaltfläche von Facebook
- Bilder und Logos
- Warenkorb
- Absatz-Widgets
- Titel-Widgets
- Buttons
- In verkleinerten Headern können Sie keine s bearbeiten.
- Die Eigenschaften des Designs setzen die Eigenschaften des verkleinerten Headers außer Kraft. Wenn Sie beispielsweise im Header einen Zeilenhintergrund einstellen, wird dieser über dem Hintergrund des verkleinerten Headers angezeigt.
- Wenn Sie im Header ein platziert haben, das nicht mit dem verkleinerten Header kompatibel ist, wird anstelle des s eine leere Spalte angezeigt.
- Im verkleinerten Header werden leere Zeilen angezeigt.
- Wenn der verkleinerte Header nicht angezeigt wird, kann dies daran liegen, dass Sie nicht genügend Zeilen auf Ihrer Website haben, damit der verkleinerte Header durch Abwärtsscrollen ausgelöst werden kann. Wenn die Seite nur eine Zeile enthält, kann die Website nicht scrollen.