Ein hoher Abschnitt in Ihrem Shopify-Shop kann den entscheidenden Unterschied machen, um die Aufmerksamkeit der Kunden zu gewinnen und Konversionen zu erzielen. Wenn Sie die Höhe Ihres Abschnitts jedoch nicht auf die richtige Größe einstellen können oder wenn er einfach nicht groß genug ist, kann dies ein frustrierendes Hindernis sein. Glücklicherweise gibt es ein paar einfache Möglichkeiten, die Höhe eines Abschnitts in Shopify zu erhöhen.
In diesem Blogbeitrag erfahren Sie, wie Sie Ihren Abschnitt auf die richtige Größe bringen, unabhängig von der Größe Ihres Shops. Wir werden auch darauf eingehen, wie Sie CSS-Code verwenden können, um die Größe eines Abschnitts weiter anzupassen, sowie weitere Tipps zur Gestaltung, um sicherzustellen, dass Ihr Abschnitt auffällt. Am Ende dieses Beitrags verfügen Sie über die Tools und Ressourcen, die Sie benötigen, um den perfekten Shopify-Abschnitt für Ihren Shop zu erhalten.
Hier ist die Anleitung:
So erhöhen Sie die Höhe eines Abschnitts in Shopify
- Gehen Sie in Ihrem Shopify-Admin-Dashboard zum Bereich "Online-Shop" und wählen Sie "Themes" aus.
- Suchen Sie das Theme, das Sie bearbeiten möchten, klicken Sie auf die Schaltfläche "Aktionen" und wählen Sie dann "Code bearbeiten" aus.
- Navigieren Sie im Theme-Editor zum Ordner "sections" und suchen Sie den Abschnitt, dessen Höhe Sie erhöhen möchten. Der Abschnitt sollte eine Datei mit dem gleichen Namen wie der Abschnitt und der Erweiterung .liquid haben.
- Suchen Sie in der Abschnittsdatei das <div>-Element, das die Klasse "section-content" oder etwas Ähnliches hat, da dies das Element ist, das die Höhe des Abschnitts steuert.
-
Fügen Sie diesem <div>-Element eine CSS-Klasse hinzu und geben Sie ihm einen benutzerdefinierten Höhenwert, z. B. height: 500px. Zum Beispiel:
Code kopieren<div class="section-content custom-height">
...
</div>
-
Navigieren Sie als Nächstes zur Haupt-Stylesheet-Datei, die normalerweise theme.scss.liquid oder main.scss.liquid genannt wird, und fügen Sie den folgenden Code hinzu:
Code kopieren.custom-height { height: 500px; }
- Speichern Sie Ihre Änderungen, und die Höhe des Abschnitts sollte auf der Frontend-Seite Ihrer Website nun auf 500px erhöht sein.
Hinweis: Sie können den Höhenwert auf eine beliebige Zahl einstellen. Wenn Sie die Höhe aller Abschnitte erhöhen möchten, können Sie anstelle einer benutzerdefinierten Klasse die Klasse „section“ verwenden.
Fazit:
Nachdem Sie die vollständige Anleitung gelesen haben, können Sie die Höhe von Shopify Div-Abschnitten ändern. Sollten Sie dennoch Schwierigkeiten haben, wenden Sie sich für eine kostenlose Beratung an unsere Shopify-Designer und -Entwickler.