Tipps für Brooklyn

In diesem Artikel erhalten Sie einige hilfreiche Tipps und Best Practices, die Ihnen bei der Einrichtung von Brooklyn für Ihren Onlineshop helfen.

Tipps für die Navigation

Ein Dropdown-Menü hinzufügen

Um Dropdown-Menüs zu Ihrem Hauptmenü hinzuzufügen, müssen Sie zuerst Menüs auf Ihrer Navigationsseite erstellen. Weitere Informationen finden Sie unter Dropdown-Menüs in Ihrem Onlineshop einrichten.

Das Hauptmenü in einem Onlineshop. Der Mauszeiger befindet sich über dem Link

Das Hauptmenü wird zu einem Seitenleistenmenü

Wenn Ihr Hauptmenü viel Platz beansprucht, wird das Menü in ein Seitenleistenmenü umgewandelt, das sich öffnet, wenn Sie auf eine Schaltfläche im Header-Abschnitt klicken:

Ein Seitenleistenmenü auf der linken Seite eines Onlineshops. Hauptmenü-Links wie

Mit den folgenden Schritten können Sie verhindern, dass Ihr Hauptmenü in den Seitenleistenstil wechselt:

  • Fügen Sie nicht mehr als vier oder fünf Links zu Ihrem Hauptmenü hinzu.
  • Verwenden Sie eine schmale Schrift für Ihre Hauptmenü-Links. Sie können die Schriftart Akzenttext aus den Typografie-Einstellungen auswählen.
  • Erstellen Sie Menüelemente mit einer begrenzten Anzahl von Zeichen. Sie können beispielsweise "FAQ" anstelle von "Häufig gestellte Fragen" oder "Kontakt" statt "Kontaktieren Sie uns" verwenden.

Bildtipps

Welche Produktbilder eignen sich am besten für Brooklyn?

  • Da hochauflösende Bilder ansprechend und professionell aussehen, sollten Ihre Produktbilder mindestens 1024 x 1024 Pixel groß sein. Die quadratische Form eignet sich am besten für Ihre Produktbilder.

  • Idealerweise sollten Ihre Bilder einen flachen Farbhintergrund haben. Dabei handelt es sich um eine einfarbige Farbe ohne Schattierung oder Hervorhebung. Alle Ihre Bilder sollten die gleiche Hintergrundfarbe haben.

  • Um den Rahmen um Ihre Produktbilder zu entfernen, setzen Sie die Farbe für den Produkthintergrund in den Farbeinstellungen auf transparent:

Es werden zwei Produkt-Listings mit weißem Hintergrund angezeigt. Der Hintergrund des Onlineshops ist ebenfalls weiß und die Produktbilder haben keine Rahmen.

Beste Größe für Slideshow-Bilder

Beide im Brooklyn-Demo-Shop gezeigten Bildfolien haben eine Größe von 1200 x 800 Pixel. Es ist empfehlenswert, dass alle Ihre Bildfolien gleich groß sind.

Abgeschnittene Bilder auf kleinen Bildschirmen oder Displays

Bei kleinen Geräten füllen Bildfolien den Bildschirm vom oberen Rand bis zum unteren Rand aus. Die Folien werden so skaliert, dass ihre Höhe der Höhe des Gerätebildschirms entspricht. Um den Bildschirm zu füllen, ohne die Bilder zu verzerren, werden die Folien links und rechts abgeschnitten.

Auf großen Bildschirmen wird die Größe der Bildfolien so geändert, dass ihre Breite der Breite des Browserfensters entspricht. Um das Fenster auszufüllen, ohne die Bilder zu verzerren, werden die Folien unten abgeschnitten.

Das folgende Beispiel zeigt die Desktop- und Mobilversion desselben Onlineshops:

Die Desktop-Version der Slideshow zeigt ein Bild, das breiter als hoch ist. Die mobile Version zeigt dasselbe Bild in der gleichen Höhe, wobei jedoch beide Bildgrößen abgeschnitten sind, damit das Bild auf den schmalen Bildschirm passt.

Ein Bild für eine Kategorie von Kante zu Kante darstellen

Um ein Bild von Kante zu Kante darzustellen, muss Ihre Kategorie ein Feature-Bild haben.

Im Brooklyn-Demo-Shop können Sie sehen, wie ein Bild von Kante zu Kante aussieht. Das obere Kategoriebild ist 1405 x 800 Pixel groß.

Die Desktop-Version der Slideshow zeigt ein Bild, das breiter als hoch ist.

Die mobile Version zeigt dasselbe Bild mit derselben Höhe, wobei jedoch beide Bildgrößen abgeschnitten wurden, um auf den schmalen Bildschirm zu passen.

Ein Bild für Blog-Einträge festlegen

Das erste Bild in einem Blog-Artikel wird als Feature-Bild für die Blog-Seite verwendet. Unter Verfassen von Blog-Beiträgen erfahren Sie, wie man ein Bild zu einem Blog-Artikel hinzufügt.

Produkttipps

Angebotshinweise zu Produkten hinzufügen

Sie können einen Angebotshinweis zu einem Produkt hinzufügen, indem Sie einen durchgestrichenen Vergleichspreis festlegen, der höher ist als der reguläre Preis. Dieser Hinweis wird für das Produkt über dem Bild auf Kategorieseiten angezeigt.

Festlegen, welche Produkte auf Kategorieseiten größer angezeigt werden sollen

Wenn Sie Ihre Kategorieseiten so konfigurieren, dass Produkte im Collage-Stil angezeigt werden, werden einige Ihrer Produkte mit großen Bildern und einige mit kleinen Bildern angezeigt. Die Größe des Bildes richtet sich nach der Reihenfolge der Produkte in ihrer Kategorie. Sie können die Reihenfolge der Produkte auf der Kategorieseite im Adminbereich ändern. Klicken Sie auf die Kategorie, die Sie bearbeiten möchten, und wählen Sie dann im Bereich Produkte die Option Manuell aus dem Dropdown-Menü Sortieren aus. Ziehen Sie anschließend die Produkte in die gewünschte Reihenfolge, in der sie in Ihrem Onlineshop angezeigt werden sollen.

Die Kategorieseite im Shopify-Adminbereich.

Bei sechs Produkten werden jeweils das erste und das sechste Bild mit großen Produktbildern dargestellt. So werden beispielsweise Bild 1, 6, 7, 12, 13 und 18 in der Kategorie groß angezeigt:

Eine Kategorieseite, auf der Produkte im Collage-Stil angezeigt werden. Zahlen zeigen die Produkte an, um zu veranschaulichen, wie die Reihenfolge der Produkte mit der Größe des Bildes zusammenhängt.

Um ein Raster von Produktbildern anzuzeigen, die alle dieselbe Größe haben, legen Sie Ihre Kategorien so fest, dass Produkte stattdessen im Rasterstil angezeigt werden.

Scroll-Animation bei Auswahl einer Variante

Wenn die Produktbeschreibung auf der Produktseite kurz genug ist, um auf den Bildschirm zu passen, ohne dass gescrollt werden muss, wird eine Scroll-Animation angezeigt, wenn Sie eine Variante auswählen, die ein Bild enthält. Wenn die Beschreibung zu lang ist, um ohne Scrollen auf den Bildschirm zu passen, wird das obere Bild einfach durch das Variantenbild ersetzt und es wird keine Scroll-Animation angezeigt.

Wenn Sie die Scroll-Animation anzeigen möchten, stellen Sie sicher, dass Ihre Produktbeschreibungen kurz sind.

Sind Sie bereit, mit Shopify zu verkaufen?

Probieren Sie es kostenlos aus