Die Kopfzeile ist die Leiste oben in deinem Shop mit Logo, Menü, Suche, Warenkorb und Länderauswahl. Dieser Artikel erklärt jede Einstellung der Kopfzeile und ihre fünf Blöcke.
Wo du sie findest
Öffne den Builder und klicke in der Vorschau auf die Kopfzeile, oder wähle Kopfzeile im Tab Abschnitte. Um eine hinzuzufügen, klicke auf Neuen Abschnitt hinzufügen und wähle Kopfzeile in der Gruppe Layout. Du kannst eine Kopfzeile pro Seite haben, auf jeder Seite. Jede Seite hat ihre eigene Kopie, nutze also Auf alle Seiten anwenden, wenn du fertig bist, siehe Abschnitte und Blöcke.
Die Kopfzeile hat immer dieselben fünf Blöcke: Logo, Menü, Suche, Warenkorb und Lokalisierung. Du kannst sie nicht hinzufügen, entfernen oder umsortieren. Du platzierst sie mit ihren eigenen Einstellungen Position und Zeile.
Einstellungen der Kopfzeile
- Fixierter Header: Beim Hochscrollen blendet die Kopfzeile aus, wenn Kunden nach unten scrollen, und holt sie zurück, wenn sie nach oben scrollen. Immer hält sie oben. Fixiert mit verkleinertem Logo hält sie oben und macht sie kleiner (weniger Innenabstand, kleineres Logo), sobald Kunden scrollen. Nie lässt sie mit der Seite wegscrollen.
- Breite: Seite hält den Inhalt in deiner Seitenbreite, Voll streckt ihn von Rand zu Rand.
- Farbschema: die Farben für Hintergrund, Text und Links der Kopfzeile.
- Transparenter Header: entfernt den Hintergrund der Kopfzeile, damit das Hero-Bild durchscheint. Siehe unten.
- Innenabstand (oben, links, rechts, unten) und der Tab Benutzerdefiniertes CSS.
Transparenter Header
Das funktioniert nur, wenn ein Hero der erste sichtbare Abschnitt direkt unter der Kopfzeile ist, denn die Kopfzeile übernimmt das Farbschema des Heros für ihren Text und ihre Symbole. Sie verliert ihren Hintergrund, Rahmen und Schatten und macht das, was dahinter liegt, leicht unscharf. Wenn Kunden am Hero vorbeiscrollen, bekommt die Kopfzeile ihre eigenen Farben zurück. Der Suchbereich und die Länderliste behalten die eigenen Farben der Kopfzeile. Die Hero-Einstellungen findest du in Abschnitt Hero.
Logo
- Logo: Wähle dein Logobild. Ohne Bild wird dein Shop-Name als Text angezeigt.
- Position: Links, Mitte oder Rechts. Breite und Höhe: die Größe des Logobereichs in Pixeln.
- Desktop-Innenabstand: Platz um das Logo, nur auf Computern.
Ein Klick auf das Logo öffnet deine Startseite. Um das zu verhindern, schalte Klick auf das Logo zur Startseite verhindern ein, siehe Einstellungen für Verbote.
Menü
Wähle unter Menü eines deiner Menüs. Die anderen Einstellungen erscheinen, sobald ein Menü gewählt ist. Wie du Menüs erstellst, steht in Wie erstelle ich Navigationsmenüs und füge sie meiner Kopf- und Fußzeile hinzu?.
- Typ: Mega (große Bereiche mit Spalten), Dropdown (einfache Listen) oder Seitenleiste (ein seitlicher Bereich, der sich über einen Menü-Button öffnet).
- Position und Zeile: wo das Menü sitzt. Oben ist die Hauptzeile mit dem Logo, Unten fügt eine zweite Zeile darunter hinzu. Wird bei Seitenleiste nicht angezeigt.
- Farbschema: die Farben des geöffneten Menübereichs.
- Mobiles Layout: Auf Handys und Tablets wandert das Menü in eine Seitenleiste. Schalte Navigationsleiste ein, um es stattdessen als Leiste unter der Kopfzeile zu zeigen, mit einem eigenen Farbschema der Navigationsleiste. Wird bei Seitenleiste nicht angezeigt.
Suche, Warenkorb und Lokalisierung
- Suche: ein Suchsymbol, das ein Suchfeld öffnet. Lege Position (Links oder Rechts) und Zeile fest.
- Warenkorb: das Warenkorbsymbol mit der Anzahl der Artikel. Warenkorbtyp ist Seitenleiste (seitlicher Bereich), Dropdown (Mini-Warenkorb unter dem Symbol) oder Seite (öffnet die Warenkorbseite). Farbschema gestaltet die Seitenleiste oder das Dropdown. Seitenleiste und Dropdown haben auch einen Schalter Leiste für kostenlosen Versand, siehe Wie funktioniert die Leiste für kostenlosen Versand?.
- Lokalisierung: ein Button, der deine Märkte auflistet, damit Kunden das Land wechseln können. Schalte Länderauswahl ein, um ihn anzuzeigen. Flaggen anzeigen zeigt die Flagge des aktuellen Landes auf dem Button, sonst ein Globussymbol. Lege Position und Zeile fest.
Gut zu wissen
- Der transparente Header bewirkt nichts: Prüfe, ob der Hero direkt unter der Kopfzeile sitzt. Eine Ankündigungsleiste oder ein anderer Abschnitt dazwischen verhindert es.
- Die Länderauswahl wird nicht angezeigt: Sie braucht mindestens zwei Märkte, siehe Wie richte ich Märkte ein, um in mehreren Ländern zu verkaufen?.
- Menüpunkte fehlen: Bearbeite das Menü selbst, nicht die Kopfzeile.