Wie kann ich Karten auf die gleiche Höhe bringen?
Lassen Sie Karten in derselben Zeile einheitlicher erscheinen, indem Sie jede Karte auf die volle Höhe dieser Zeile strecken. Bis dedizierte Einstellungen verfügbar sind, fügen Sie dem Abschnitt in der Einstellung Custom CSS ein kleines CSS-Snippet hinzu. Einzelheiten zur Einrichtung finden Sie in der Shopify-Dokumentation zum Hinzufügen von benutzerdefiniertem CSS zu Ihrem Theme
Karten auf die gleiche Höhe bringen
Abschnitt betitelt „Karten auf die gleiche Höhe bringen“-
Wählen Sie im Theme-Editor den Abschnitt aus, den Sie aktualisieren möchten. Eine Übersicht finden Sie in der Shopify-Dokumentation zum Theme-Editor
-
Scrollen Sie zum Ende der Abschnittseinstellungen und öffnen Sie Custom CSS.
-
Fügen Sie das folgende CSS ein:
.card {height: 100%;} -
Speichern Sie Ihre Änderungen.
Kartentext unter Bildern positionieren
Abschnitt betitelt „Kartentext unter Bildern positionieren“Standardmäßig kann der Kartentext am unteren Rand einer Karte mit gleicher Höhe verankert sein. Wenn der Text stattdessen direkt unter dem Bild platziert werden soll, fügen Sie auch dieses CSS hinzu:
.card__content { justify-content: flex-start;}Nutzungshinweise
Abschnitt betitelt „Nutzungshinweise“- CSS pro Abschnitt anwenden. Fügen Sie den Code in jedem Abschnitt hinzu, in dem die Karten die gleiche Höhe haben sollen.
- Textausrichtung bewusst auswählen. Fügen Sie das zweite Snippet nur hinzu, wenn der Kartentext direkt unter dem Bild beginnen soll.
- Vor der Vorschau speichern. Speichern Sie Ihre Änderungen und überprüfen Sie anschließend den Abschnitt, um zu bestätigen, dass das Kartenlayout korrekt aussieht.