Tipps für Supply
In diesem Artikel erhältst du einige hilfreiche Tipps und Best Practices, die dir bei der Einrichtung von Supply für deinen Onlineshop helfen.
Bildtipps
Produktbilder
Fotos mit höherer Auflösung sehen im Supply-Theme besser aus und sollten daher mindestens 1024 x 1024 Pixel groß sein. Bilder werden bei Bedarf automatisch verkleinert. Fotos mit höherer Auflösung sind besonders wichtig, wenn du den Bildzoom auf deinen Produktseiten aktivierst.
Das optimale Verhältnis von Breite zu Höhe für deine Produktfotos ist ein Quadrat.
Die Slideshow verkleinern
Damit die Slideshow weniger vertikalen Platz auf deiner Startseite einnimmt, solltest du Bilder im Querformat verwenden, also Bilder, die breiter sind als hoch. Du solltest Bilder mit einer Breite von 1.000 Pixel hochladen, damit deine Folien auf größeren Bildschirmen links und rechts keinen Whitespace haben. Bilder mit einer geringeren Breite werden in deiner Slideshow zentriert dargestellt.
Tipps für den Header
Wenn dein Header zu hoch ist, dann kannst du ihn durch Anpassung deines Logos verkleinern. Wenn dein Logo zu groß ist, dann kannst du es verkleinern, indem du die maximale Breite anpasst. Dein Logo kann auch unsichtbare oder weiße Pixel enthalten, die den Whitespace über und unter dem Logo vergrößern. Mithilfe einer Bildbearbeitungssoftware wie Photoshop kannst du diese Pixel aus deinem Logobild herausschneiden. Wenn du dein Logo zugeschnitten hast, kannst du es erneut hochladen. Das Entfernen des Whitespace in deinem Logobild kann die Höhe deines Headers erheblich verringern.
Breite deines Logos anpassen
- Gehe in deinem Shopify-Adminbereich auf Onlineshop > Themes.
- Klicken Sie neben Supplyauf Anpassen.
- Tippe in der Shopify App auf Shop.
- Klicke im Bereich Vertriebskanäle auf Onlineshop.
- Tippe auf Themes verwalten.
- Tippe neben Supply auf Anpassen.
- Tippe auf Bearbeiten.
- Tippe in der Shopify App auf Shop.
- Klicke im Bereich Vertriebskanäle auf Onlineshop.
- Tippe auf Themes verwalten.
- Tippe neben Supply auf Anpassen.
- Tippe auf Bearbeiten.
- Klicke auf Header.
- Gib im Feld Benutzerdefinierte Logobreite (in Pixel) eine neue Breite ein. Der Standard-Pixelwert ist
305
. Verwende einen kleineren Pixelwert, um die Größe deines Logos und damit auch die Höhe deiner Überschrift zu verringern. Wenn du die Breite deines Logos verringerst, wird auch seine Höhe verringert, da dein Logo verkleinert wird, während seine Proportionen erhalten bleiben. - Klicke auf Speichern.
Tipps für die Navigation
Wenn du Supply verwendest, können dir die folgenden Tipps dabei helfen, die Navigation deines Shops zu verbessern.
Ein Dropdown-Menü hinzufügen
Um Dropdown-Menüs zu deinem Hauptmenü hinzuzufügen, musst du zuerst Menüs auf deiner Navigationsseite erstellen.
Best Practices für das Hauptmenü
Wenn eine Zeile in deinem Hauptmenü zu viele Elemente hat, dann werden die letzten Links, die nicht passen, zu einem Dropdown-Menü mit der Bezeichnung Mehr hinzugefügt.

Dieses Verhalten ist nicht strikt von der Anzahl der Links in deinem Hauptmenü abhängig, obwohl es empfehlenswert ist, sich auf fünf oder maximal sechs Links zu beschränken. Wenn du weitere Links hinzufügen möchtest, hast du folgende Möglichkeiten:
- Verkleinere deine Navigationslinks. Die Schriftgröße dieser Links wird über die Schriftgröße des Hauptmenüs in deinen Typografie-Einstellungen festgelegt.
- Verwende für jeden Link weniger Zeichen. Ändere zum Beispiel 'Häufig gestellte Fragen' in 'FAQ', 'Kontaktiere uns' in 'Kontakt', 'Katalog' zu 'Shop' und alle 'und' in '&'.
Zu viele Elemente in deiner Navigation zu haben, kann dazu führen, dass deine Seite schwer zu bedienen ist. Mit zu vielen Menüpunkten können deine Kunden wichtige Elemente übersehen. Versuche daher, die Navigation auf fünf oder sechs Elemente zu beschränken. Verwende Drop-down-Menüs, wenn du Zugriff auf mehr als sechs Seiten geben möchtest.
Ein häufiger Fehler ist das Hinzufügen von Links zu jeder Kategorie im Hauptmenü. Versuche stattdessen, die Kategorien in einem Dropdown-Menü unter einem Link wie "Shop" oder "Katalog" aufzulisten. Du kannst die Kategorien auch in Gruppen aufteilen und jeder Gruppe ein Dropdown-Menü zuweisen. Oder du kannst Produkt-Tags verwenden und dadurch Unterkategorien von Produkten erstellen.
Seitenleiste entfernen
Um die Seitenleiste aus deinem Shop zu entfernen, musst du Code zu zwei deiner Theme-Dateien hinzufügen.
Gehe in deinem Shopify-Adminbereich auf Onlineshop > Themes.
Suche das Theme, das du bearbeiten möchtest und klicke dann auf Aktionen > Code bearbeiten.
Tippe in der Shopify App auf Shop.
Tippe unter Vertriebskanäle auf Onlineshop.
Tippe auf Themes verwalten.
Suche das Theme, das du bearbeiten möchtest und klicke dann auf Aktionen > Code bearbeiten.
Tippe in der Shopify App auf Shop.
Tippe unter Vertriebskanäle auf Onlineshop.
Tippe auf Themes verwalten.
Suche das Theme, das du bearbeiten möchtest und klicke dann auf Aktionen > Code bearbeiten.
Klicke in der Übersicht Abschnitte auf
collection-template.liquid
.Suche in der Datei nach
has_sidebar
. Lösche die folgenden Codezeilen:
{% if collection.all_tags.size > 0 %}
{% assign has_sidebar = true %}
{% endif %}
Klicke auf Speichern.
Klicke in der Übersicht Abschnitte auf
collection-list-template.liquid
.Suche in der Datei nach
has_sidebar
. Lösche die folgenden Codezeilen:
{% if collection.all_tags.size > 0 %}
{% assign has_sidebar = true %}
{% endif %}
- Klicke auf Speichern.
Produkttipps
Die folgenden Tipps helfen dir, deine Produkte mit Supply zu präsentieren.
Verwenden der erweiterten Gruppenfilterung
Wenn du viele Produkte hast, kannst du Untergruppen aktivieren, damit Kunden deine Produkte sortieren können.
Definiere deine Gruppen. Für einen Kamera-Shop können z. B. die Gruppen Marke, Brennweite und Auflösung eingerichtet werden.
Stelle allen vorhandenen Tags den Namen der Gruppe voran, in der sie sich befinden sollen. Verwende dabei das Format Group_Tag Name an. In diesem Beispiel wären einige der Tags Brand_Canon, Focal Length_18 - 55mm und Resolution_12 MP. Die linke Seite des Unterstrichs ist der Gruppenname und die rechte Seite ist der Tag für das Produkt. Auf jeder Seite des Unterstrichs können Leerzeichen enthalten sein.
Speichere deine
.csv
-Datei und importiere die Produkte zurück in deinen Shop. Stelle sicher, dass du beim Hochladen der Datei die Option Ersetze alle vorhandenen Produkte, die den gleichen Handle haben. aktivierst, um zu verhindern, dass doppelte Produkte erstellt werden.Aktiviere die Filterung nach Gruppe auf deinen Kategorieseiten:
Ordne Filtergruppen und Tags neu an
Die Gruppen sowie die in den Gruppen aufgeführten Tags sind alphabetisch sortiert. Ein Shopify-Experte kann dir helfen, die Sortierung anzupassen.
Tipps zur Preisgestaltung
Wenn du Supply verwendest, helfen dir die folgenden Tipps bei der Preisgestaltung.
Rundung von Verkaufsbeträgen deaktivieren
Gehe in deinem Shopify-Adminbereich auf Onlineshop > Themes.
Suche das Theme, das du bearbeiten möchtest und klicke dann auf Aktionen > Code bearbeiten.
Tippe in der Shopify App auf Shop.
Tippe unter Vertriebskanäle auf Onlineshop.
Tippe auf Themes verwalten.
Suche das Theme, das du bearbeiten möchtest und klicke dann auf Aktionen > Code bearbeiten.
Tippe in der Shopify App auf Shop.
Tippe unter Vertriebskanäle auf Onlineshop.
Tippe auf Themes verwalten.
Suche das Theme, das du bearbeiten möchtest und klicke dann auf Aktionen > Code bearbeiten.
Öffne auf der linken Seite unter Assets
timber.scss.liquid
.Füge am Ende der Datei den folgenden Code hinzu:
.sale-tag sup {
display: inline;
top: 0;
font-size: 100%;
&:before {
content: '.';
}
}
- Klicke auf Speichern.
Tipps für den Warenkorb
Der folgende Tipp stellt sicher, dass der Warenkorb deines Shops ordnungsgemäß funktioniert, wenn du JavaScript zu Supply hinzugefügt hast.
Ändern des Warenkorbstils, damit erweitertes JavaScript funktioniert
In Supply wird jedes JavaScript, das du zu cart.liquid
hinzufügst, in den Warenkorbeinschüben und Warenkorbfenstern nicht ausgeführt. Es wird nur ausgeführt, wenn du /cart
an die URL deines Shops anhängst. Zum Beispiel so: http://your.store.url/cart
.
Wenn du eine der folgenden Funktionen zu deiner Warenkorbseite hinzufügen möchtest, dann musst du als Warenkorbtyp Seite einstellen:
- Versandkostenrechner
- Mehrere Währungen
- Geschenkpapier
- Validierung von Warenkorbattributen
- Datumsauswahl
- ein Kontrollkästchen mit dem Text "Ich stimme den Bedingungen zu"
Schritte:
- Gehe in deinem Shopify-Adminbereich auf Onlineshop > Themes.
- Klicken Sie neben Supplyauf Anpassen.
- Tippe in der Shopify App auf Shop.
- Klicke im Bereich Vertriebskanäle auf Onlineshop.
- Tippe auf Themes verwalten.
- Tippe neben Supply auf Anpassen.
- Tippe auf Bearbeiten.
- Tippe in der Shopify App auf Shop.
- Klicke im Bereich Vertriebskanäle auf Onlineshop.
- Tippe auf Themes verwalten.
- Tippe neben Supply auf Anpassen.
- Tippe auf Bearbeiten.
- Klicke auf Theme-Einstellungen.
- Klicke auf Warenkorb.
- Wähle in der Dropdown-Liste Warenkorbstil die Option Seite aus.
- Klicke auf Speichern.