Zum Inhalt springen

Features-Leiste

Heben Sie wichtige Vorteile und Ankündigungen mit Symbolen, kurzem Text und flexiblen Sichtbarkeitssteuerungen hervor.

Nutzen Sie diesen Abschnitt, um kurze, hochwertige Nachrichten wie Versandvorteile, Supportversprechen, Shop-Richtlinien oder zeitnahe Ankündigungen hervorzuheben. Er kann standardmäßig dem gemeinsamen Theme-Verhalten folgen, oder Sie können Feature-Blöcke hinzufügen, um den hier angezeigten Inhalt vollständig zu steuern.

Diese Einstellungen bestimmen das gesamte Layout und die Darstellung der Leiste, bevor Sie einzelne Elemente anpassen.

  1. Textausrichtung steuert, wie der Feature-Text innerhalb jedes Elements sitzt. Stimmen Sie sie mit nahe gelegenen Abschnitten ab, damit die Seite konsistent wirkt.
  2. Symbolposition verändert das Verhältnis von Symbolen und Text zueinander. Links oder rechts eignet sich meist für kompakte horizontale Layouts, während oben oder unten besser funktioniert, wenn jedes Feature mehr visuelle Abgrenzung benötigt.
  3. Symbolrahmen anzeigen fügt Symbolen zusätzliche Hervorhebung hinzu. Das kann einfache Symbole stärker hervorheben, kann aber unruhig wirken, wenn der Abschnitt bereits starke Trennlinien oder einen kräftigen Hintergrund verwendet.

Wenn dieser Abschnitt benutzerdefinierten Feature-Inhalt anzeigen soll, fügen Sie mindestens einen Feature-Block hinzu. Sobald Blöcke hinzugefügt wurden, überschreiben sie das standardmäßige gemeinsame Inhaltsverhalten für diesen Abschnitt.

Allgemeine Hinweise dazu, wie Blöcke im Editor funktionieren, finden Sie in der Shopify-Dokumentation zu Abschnitten und Blöcken

Diese Einstellungen überschreiben die Standardfarben für diesen Abschnitt. Verwenden Sie sie, wenn die Features-Leiste stärkeren Kontrast, einen Markenakzent oder eine andere visuelle Priorität als das umliegende Layout benötigt. Mehr erfahren in der Company XYZ-Dokumentation zu Farbeinstellungen.

Passen Sie Symbol-, Text- und Symbolrahmenfarben als Gruppe an, damit der Abschnitt bewusst gestaltet wirkt. Wenn Sie einen benutzerdefinierten Hintergrund verwenden, prüfen Sie die Lesbarkeit sorgfältig, bevor Sie veröffentlichen.

  1. Feature

Verwenden Sie den Feature-Block, um ein Symbol, einen Titel, optionalen unterstützenden Text und einen optionalen Link hinzuzufügen. Mehr erfahren in der Company XYZ-Dokumentation zum Feature-Block.

  1. Symbol kann ein Emoji oder ein Symbolname sein. Lassen Sie es leer für eine einfachere textorientierte Darstellung.
  2. Titel und Unterüberschrift funktionieren am besten, wenn sie kurz gehalten werden. Kurzer Text hilft dabei, mehrere Features in einer Zeile ausgewogen zu halten.
  3. Link ist nützlich für verwandte Ziele wie Richtlinien, FAQs oder Kollektionen. Fügen Sie Links nur hinzu, wenn das Ziel klar zur Nachricht passt.
  4. Block-Sichtbarkeit ermöglicht es Ihnen, einzelne Features auf Desktop oder Mobilgeräten auszublenden, was hilfreich ist, wenn eine kürzere mobile Version besser lesbar ist.

Padding-Einstellungen steuern den Platz oberhalb und unterhalb der Features-Leiste. Kleinere Abstände eignen sich gut für nutzerorientierte Hinweise, während größere Abstände den Abschnitt eher wie einen eigenständigen Inhaltsbereich wirken lassen. Separate Desktop- und Mobilwerte sind nützlich, wenn die Leiste auf kleineren Bildschirmen beengt wirkt.

Abschnittshintergrund-Einstellungen ermöglichen es Ihnen, einen Farbverlauf, ein Bild oder ein Video hinter der Features-Leiste hinzuzufügen. Das ist nützlich, wenn der Abschnitt mehr visuelle Abgrenzung oder einen stärker werblichen Look benötigt. Overlay-Einstellungen helfen, die Lesbarkeit zu erhalten, und Farbverlaufs-Overlays haben Vorrang vor einfarbigen Overlay-Farben.

Trennlinien-Einstellungen fügen oben oder unten im Abschnitt eine Linie hinzu. Verwenden Sie sie, wenn die Leiste zwischen größeren Abschnitten sitzt und eine dezente Begrenzung benötigt, ohne mehr Platz hinzuzufügen. Wenn die Farbe der Trennlinie auf transparent belassen wird, wird die gemeinsame Rahmenfarbe verwendet.

Sichtbarkeitseinstellungen steuern, ob der gesamte Abschnitt auf Desktop, Mobilgeräten oder beiden angezeigt wird. Das ist hilfreich, wenn Sie ein vereinfachtes mobiles Layout oder eine andere Anordnung über Geräte hinweg wünschen. Wenn Sie zusätzlich Sichtbarkeit auf Blockebene verwenden, prüfen Sie doppelt, dass mindestens ein Feature dort sichtbar bleibt, wo Sie es benötigen.

Breiten-Einstellungen steuern sowohl die maximale Inhaltsbreite als auch die äußere Abschnittsbreite. Schmalere Inhaltsbreiten können kurzen Feature-Text leichter erfassbar machen, während breitere Einstellungen dazu beitragen können, dass sich die Leiste stärker in umfangreiche Seitenlayouts einfügt. Prüfen Sie Breitenänderungen nach Möglichkeit auf der Live-Seite, da die Editor-Ansicht Abstände irreführend wirken lassen kann.

  1. Halten Sie den Text kurz. Dieser Abschnitt eignet sich am besten für kurze Aussagen, die Kundinnen und Kunden auf einen Blick verstehen können.
    1. Kurze Nachrichten lassen sich in einer schmalen Leiste leichter erfassen.
    2. Wenn eine Nachricht mehr Kontext benötigt, verlinken Sie stattdessen das vollständige Ziel, anstatt mehr Text hinzuzufügen.
  2. Verwenden Sie Blöcke gezielt. Fügen Sie Feature-Blöcke hinzu, wenn diese Leiste abschnittsspezifische Symbole, Text oder Links statt des gemeinsamen Inhaltsverhaltens anzeigen soll.
    1. Das Hinzufügen von Blöcken kann das, was hier angezeigt wird, wesentlich verändern.
    2. Prüfen Sie den Abschnitt nach dem Hinzufügen oder Entfernen von Blöcken, um zu bestätigen, dass die endgültige Nachricht weiterhin ausgewogen wirkt.
  3. Prüfen Sie beide Viewport-Größen. Desktop- und Mobilsteuerungen können Layout, Ausrichtung, Sichtbarkeit und Medienverhalten unterschiedlich beeinflussen.
    1. Prüfen Sie, ob Symbole und Text auf kleineren Bildschirmen weiterhin stimmig ausgerichtet wirken.
    2. Stellen Sie sicher, dass mobile oder Desktop-exklusive Entscheidungen die Leiste weiterhin lesbar und nützlich lassen.
  4. Verwenden Sie Farb- und Medienüberschreibungen sorgfältig. Standardwerte bewahren in der Regel das Fallback-Styling, während explizite Farben, Verläufe oder Medienauswahlen den Abschnitt eigenständiger machen.
    1. Starke lokale Gestaltung kann die Hervorhebung verbessern, erhöht aber auch die Notwendigkeit, den Kontrast zu prüfen.
    2. Getrennte Desktop- und Mobilmedien können Zuschnitt und Lesbarkeit beeinflussen, daher bestätigen Sie beide Versionen vor dem Veröffentlichen.
  5. Halten Sie formularartige Nachrichten leicht lesbar. Wenn die Leiste für Kundeneingaben, Validierung oder Erfolgs- und Fehlermeldungen verwendet wird, lassen Sie genug Kontrast und Abstand, damit diese Zustände klar hervortreten.