Tips voor Brooklyn

Dit artikel beschrijft een aantal handige tips en procedures voor het instellen van Brooklyn voor uw online winkel.

Een vervolgkeuzemenu toevoegen

Als u vervolgkeuzemenu's aan uw hoofdmenu wilt toevoegen, moet u menu's maken op uw navigatiepagina. Raadpleeg Vervolgkeuzemenu's instellen in uw online winkel voor meer informatie.

Het hoofdmenu van een online winkel. Terwijl de muisaanwijzer op de link 'Catalogus' staat, wordt een vervolgkeuzemenu weergegeven met links naar collecties zoals 'Woonkamer' en 'Slaapkamer'.

Hoofdmenu wordt een zijbalkmenu

Als je hoofdmenu veel ruimte in beslag neemt, wordt het menu geconverteerd naar een zijbalkmenu dat wordt geopend wanneer je op een knop in het kopgedeelte klikt:

Een zijbalkmenu aan de linkerkant van een online winkel. Hoofdmenulinks zoals 'Startpagina' en 'Catalogus' worden in het zijbalkmenu weergegeven.

Je kunt voorkomen dat je hoofdmenu verandert in de zijbalkstijl door de volgende stappen te volgen:

  • Voeg niet meer dan vier of vijf links toe aan uw hoofdmenu.
  • Gebruik een smal lettertype voor de links in je hoofdmenu. Je kunt het lettertype Accent-tekst wijzigen in de typografie-instellingen.
  • Maak menu-items met een beperkt aantal tekens. Je kunt bijvoorbeeld 'FAQ' gebruiken in plaats van 'Veelgestelde vragen' of 'Contact opnemen' in plaats van 'Neem contact met ons op'.

Tips voor afbeeldingen

Beste typen productafbeeldingen voor Brooklyn

  • Omdat afbeeldingen met een hoge resolutie er gepolijst en professioneel uitzien, moeten je productafbeeldingen minimaal 1024 x 1024 pixels zijn. De beste vorm voor je productafbeeldingen is een vierkant.

  • Idealiter hebben uw afbeeldingen een egale achtergrondkleur. Een egale kleur is een effen kleur zonder schaduwen of markeringen. Al uw afbeeldingen moeten dezelfde achtergrondkleur hebben.

  • Als u het kader rondom je productafbeeldingen wilt verwijderen, stelt u de kleur Productachtergrond in de kleurinstellingen in op transparant:

Er worden twee productvermeldingen weergegeven met een witte achtergrond. De achtergrond van de online winkel is ook wit en er zijn geen kaders rond de productafbeeldingen.

Beste formaat voor afbeeldingen van diavoorstellingen

Beide afbeeldingsdia's die worden weergegeven in de Brooklyn-demowinkel zijn 1200 x 800 pixels. Het is een goed idee om al uw afbeeldingsdia's hetzelfde formaat te geven.

Afbeeldingen bijsnijden op kleine schermen

Op kleine apparaten vullen afbeeldingsdia's het scherm van de bovenrand tot de onderrand. De dia's worden zodanig aangepast dat ze de hoogte van het scherm van het apparaat hebben. Om het scherm te vullen zonder de afbeeldingen te vervormen, worden de dia's links en rechts bijgesneden.

Op grote schermen worden de afbeeldingsdia's zo aangepast dat de breedte ervan overeenkomt met de breedte van het browservenster. Om het venster te vullen zonder de afbeeldingen te vervormen, worden de dia's onderaan bijgesneden.

In het volgende voorbeeld ziet u de desktop- en mobiele versie van dezelfde online winkel:

Bij de desktopversie van de diavoorstelling wordt een afbeelding weergegeven die breder is dan dat deze hoog is. Bij de mobiele versie wordt dezelfde afbeelding met dezelfde hoogte weergegeven, maar worden beide afmetingen van de afbeelding bijgesneden zodat de afbeelding op het smalle scherm past.

Een rand-tot-rand-afbeelding voor een collectie weergeven

Als u een rand-tot-rand-afbeelding wilt weergeven, moet uw collectie een uitgelichte afbeelding hebben.

Je kunt zien hoe een rand-tot-rand-collectieafbeelding eruitziet in de Brooklyn-demowinkel. De collectieafbeelding die bovenaan wordt weergegeven, is 1405 x 800 pixels.

Bij de desktopversie van de diavoorstelling wordt een afbeelding weergegeven die breder is dan dat deze hoog is.

Bij de mobiele versie wordt dezelfde afbeelding met dezelfde hoogte weergegeven, maar worden beide afmetingen van de afbeelding bijgesneden zodat de afbeelding op het smalle scherm past.

Een afbeelding instellen voor blogposts

De eerste afbeelding in een blogartikel wordt gebruikt als de uitgelichte afbeelding voor de blogpagina. Lees in Blogposts schrijven hoe u een afbeelding aan een blogartikel toevoegt.

Tips voor producten

Uitverkoopbadges toevoegen aan producten

U kunt een uitverkoopbadge toevoegen aan een product door een vergelijken met prijs in te stellen die hoger is dan de normale prijs. De badge wordt op de afbeelding voor dat product op collectiepagina's weergegeven.

Instellen welke producten groter worden weergegeven op collectiepagina's

Als je je collectiepagina's zo instelt dat producten in collagestijl worden weergegeven, worden sommige van je producten weergegeven met grote afbeeldingen en sommige met kleine afbeeldingen. De grootte van de afbeelding is gebaseerd op de volgorde van de producten in de collectie. Je kunt de volgorde van de producten op de collectiepagina wijzigen in de beheerder. Klik op de collectie die je wilt bewerken, en selecteer vervolgens in het gebied Producten de optie Handmatig in het vervolgkeuzemenu Sorteren. Sleep de producten vervolgens in de volgorde waarin je ze in je online winkel wilt weergeven.

De pagina Collecties in de Shopify-beheerder.

Voor elke zes producten hebben het eerste en zesde product grote productafbeeldingen. Bijvoorbeeld: de eerste, zesde, zevende, twaalfde, dertiende en achttiende afbeeldingen in de collectie hebben grote afbeeldingen:

Een collectiepagina waarop producten in de collagestijl worden weergegeven. Op de producten worden getallen weergegeven om te illustreren hoe de volgorde van de producten zich verhoudt tot de grootte van de afbeelding.

Als u een raster met productafbeeldingen van hetzelfde formaat wilt weergeven, stelt u uw collecties zodanig in dat producten in de rasterstijl worden weergegeven.

Scrollanimatie bij het selecteren van een variant

Als de productbeschrijving op de productpagina kort genoeg is om op het scherm te passen zonder te scrollen, ziet u een scrollanimatie wanneer u een variant selecteert die een afbeelding heeft. Als de beschrijving te lang is om op het scherm te passen zonder omlaag te scrollen, wordt de bovenste afbeelding vervangen door de variantafbeelding en blijft de scrollanimatie achterwege.

Als u de scrollanimatie wilt weergeven, moet u ervoor zorgen dat uw productbeschrijvingen kort zijn.

Klaar om te beginnen met verkopen met Shopify?

Probeer het gratis