Zum Inhalt springen

Trennlinien-Einstellungen

Passen Sie die Trennlinien oberhalb und unterhalb von Inhalten an, um sauberere und besser ausgearbeitete Seitenübergänge zu erzielen.

Verwenden Sie diese Einstellungen, um eine Trennlinie oberhalb, unterhalb oder an beiden Rändern eines Inhaltsbereichs hinzuzufügen. Trennlinien helfen dabei, lange Seiten zu gliedern, Übergänge zwischen Inhalten zu definieren und Struktur hinzuzufügen, ohne den Inhalt selbst zu verändern. Einen umfassenderen Überblick darüber, wie Theme-Inhalte organisiert sind, finden Sie in der Shopify-Dokumentation zu Abschnitten und Blöcken

Sie können die oberen und unteren Trennlinien unabhängig voneinander gestalten, sodass jede Kante hervorgehoben oder sauber gehalten werden kann. Dadurch haben Sie mehr Flexibilität, wenn ein Übergang eine klarere Begrenzung benötigt als der andere.

Wählen Sie den Trennlinienstil danach aus, wie deutlich der visuelle Bruch wirken soll:

  1. Linie erzeugt die klarste und minimalistischste Trennung.
  2. Gestrichelt bringt mehr Struktur ein und eignet sich gut für ausdrucksstärkere Layouts.
  3. Gepunktet wirkt leichter und dekorativer.
  4. Keine entfernt die Trennlinie von dieser Kante.

Schalten Sie Trennlinien nicht für jeden Inhaltsbereich in einer Abfolge ein. Zu viele Trennlinien können die Seite überladen wirken lassen und die Wirkung wichtiger Übergänge verringern.

Verwenden Sie die Trennlinienfarbe, um sie an benachbarte Rahmen anzupassen oder etwas mehr Kontrast zwischen Inhaltsbereichen zu schaffen. In den meisten Layouts funktioniert eine dezente Farbe am besten, da Trennlinien die Seitenstruktur unterstützen und nicht mit dem Inhalt konkurrieren sollten.

Wenn Sie die Farbe transparent lassen, verwendet die Trennlinie die Rahmenfarbe des Themes. Leere, transparente oder standardmäßige Werte behalten in der Regel das Fallback-Styling des Themes bei, während explizite Farben, Verläufe oder Medien-Overrides den Bereich unabhängiger wirken lassen. Dies ist in der Regel die beste Wahl, wenn Sie ein einheitliches Erscheinungsbild über mehrere Bereiche hinweg wünschen, ohne jeden Bereich manuell anzupassen. Zugehörige Steuerelemente im Theme-Editor finden Sie in der Shopify-Dokumentation zum Theme-Editor

  1. Trennlinien gezielt hinzufügen. Verwenden Sie sie dort, wo sie das Erfassen erleichtern oder einen Übergang zwischen zwei Inhaltsbereichen verdeutlichen.
  2. Den Stil an das Layout anpassen. Durchgezogene Linien passen zu klareren Designs, während gestrichelte oder gepunktete Linien bei weicheren oder dekorativeren Trennungen besser funktionieren.
  3. Den Kontrast kontrolliert halten. Eine zu markante Trennlinie kann von Überschriften, Bildern und Handlungsaufforderungen ablenken.
  4. Die gemeinsame Rahmenfarbe für Konsistenz verwenden. Transparente Farbe ist eine praktische Wahl, wenn Trennlinien auf das restliche Theme abgestimmt bleiben sollen.
  5. Beide Viewports prüfen. Desktop- und Mobile-Steuerelemente können unterschiedliche Ausrichtung, Sichtbarkeit oder Medienverhalten erzeugen, prüfen Sie daher beide Größen vor der Veröffentlichung.
  6. Overrides bewusst einsetzen. Explizite Farben oder medienbasierte Auswahlmöglichkeiten können einen lokalen Bereich hervorheben, verwenden Sie sie daher nur dort, wo Sie einen unabhängigeren Look wünschen.