Symptom

Auf dem Smartphone fehlen das Hamburger-Menü (die drei Striche, die das Menü öffnen) und das Warenkorbsymbol oben auf Ihrer Website. Die Symbole sind weiterhin vorhanden und funktionieren, sie haben jedoch dieselbe Farbe wie die Leiste dahinter und sind deshalb nicht zu sehen.

Ursache

Das passiert meist, nachdem Sie die Farben Ihrer Vorlage geändert haben. Durch eine Änderung kann der Hintergrund der mobilen Kopfleiste fast dieselbe Farbe bekommen wie die Symbole für Warenkorb und Hamburger-Menü, sodass die Symbole in der Leiste verschwinden. Es ist nichts kaputt und es fehlt nichts: Die Symbole sind weiterhin da und funktionieren, Sie können sie nur nicht sehen.

Lösung

Geben Sie der mobilen Kopfleiste mit einem kleinen benutzerdefinierten Website-Inhalt eine eigene Hintergrundfarbe.

1. Öffnen Sie Ihren Shop in ShopFactory.
2. Klicken Sie auf das Dropdown-Menü "Zentral" -> Benutzerdefinierte Website-Inhalte.
3. Klicken Sie auf die Schaltfläche + (Hinzufügen), um einen NEUEN benutzerdefinierten HTML-Block im Website-Bereich 1 hinzuzufügen.
4. Ziehen Sie den Textblock in den Beschreibungsbereich.
5. Klicken Sie oben rechts in Ihrem neuen Textblock (HC1 oder HC2, je nachdem, wie viele Blöcke Sie bereits haben) auf das EDIT-Symbol (Stift).
6. Ändern Sie den HTML-Bezeichnungsnamen in: Mobile header background
7. Kopieren Sie den Code in das Inhaltsfenster:

<style>
.ThemeVersion-11 .header.mobile .utils {
background: #747570;
}
</style>

8. Ersetzen Sie #747570 durch den Hex-Code der Farbe, die die Leiste haben soll. Wählen Sie eine Farbe, die sich von den Symbolen unterscheidet, zum Beispiel die Farbe, die Sie sonst in Ihrer Kopfzeile verwenden.
9. OK anklicken, danach auf Fertigstellen klicken.
10. Speichern Sie Ihren Shop und zeigen Sie ihn in einem externen Browser an, auf einem Telefon oder in der Telefonansicht Ihres Browsers.
11. Veröffentlichen Sie den Shop erneut, damit die Änderung online geht.

Hinweise

• Zeigt Ihr Telefon noch die alte Farbe, aktualisieren Sie die Seite oder leeren Sie den Browser-Cache. Eine veröffentlichte Änderung kann einige Minuten brauchen.
• Derselbe Block bestimmt auch die Farbe der mobilen Kopfleiste allgemein. Sie können ihn also ebenso verwenden, um der mobilen Kopfzeile genau dieselbe Farbe zu geben wie der Desktop-Version Ihrer Website.

Verwandte Artikel

• Ändern der Textfarbe in weiß auf weiß oder schwarz auf schwarz (Abschnitt E betrifft die mobile Logoleiste)
• Benutzerdefinierten HTML-Code zu einer Seite oder zur gesamten Website hinzufügen