De meeste klanten bestellen vanaf mobiele apparaten, dus we raden aan om de mobiele preview te controleren voordat je je wijzigingen opslaat.
Wat je kunt aanpassen
De Design & Branding-zijbalk is georganiseerd in drie hoofdsecties:Voordat je begint
Toegang tot Design & Branding-functies
Sommige Design & Branding-secties zijn alleen beschikbaar met storekit+. Als een sectie in je admin vergrendeld is, bevat je huidige abonnement mogelijk geen volledige toegang tot Design & Branding. Om alle Design & Branding-opties te ontgrendelen, moet je upgraden naar storekit+.Volledige toegang nodig tot Design & Branding? Neem contact op met storekit Support om deze functie aan je account toe te voegen. Een storekit+-abonnement is vereist.
Branding
Branding-instellingen bepalen de visuele identiteit van je bestelpagina. De Branding-sectie bevat:- Afbeeldingen
- Typografie
- Knoppen
- Kleuren
Afbeeldingen
Met de sectie Images kun je de belangrijkste afbeeldingsactiva bijwerken die op je bestelpagina worden gebruikt.Afbeeldingstips
- Gebruik afbeeldingen van hoge kwaliteit die bij je merk passen.
- Houd logo’s eenvoudig en gemakkelijk herkenbaar.
- Gebruik vierkante afbeeldingen voor logo’s en favicons.
- Gebruik landschapsafbeeldingen voor header-afbeeldingen.
- Plaats belangrijke tekst niet vlakbij de rand van header-afbeeldingen, aangezien afbeeldingen anders kunnen worden bijgesneden op mobiel.
- Controleer altijd de mobiele preview voordat je opslaat.
Header-afbeeldingen kunnen anders worden bijgesneden afhankelijk van het schermformaat. Houd voor het beste resultaat het belangrijkste deel van de afbeelding gecentreerd.
Typografie
Met de sectie Typografie kun je de tekststijl aanpassen die over je bestelpagina wordt gebruikt. Je kunt de typografie aanpassen voor verschillende tekstgebieden, zoals koppen, bodytekst, knoppen en menutekst. Elke typografie-instelling regelt het gebruikte lettertype, of de tekst met hoofdletters wordt geschreven, en de grootteschaal.Font
De font-instelling regelt het lettertype dat wordt gebruikt voor het geselecteerde tekstgebied. Standaard kan de bestelpagina het systeemlettertype gebruiken. Je kunt ook een aangepast lettertypebestand uploaden waar dit wordt ondersteund.Aangepaste lettertypen moeten worden geüpload als
WOFF2-lettertypebestand.Capitalisation
Met de schakelaar voor hoofdlettergebruik kun je kiezen of het geselecteerde tekstgebied standaard hoofdlettergebruik of uppercase-styling gebruikt. Dit kan handig zijn om koppen, knoppen of menulabels duidelijker te laten opvallen.Size scale
Met de grootteschaal kun je de relatieve grootte van het geselecteerde tekstgebied aanpassen. Het verkleinen van de grootteschaal maakt de geselecteerde tekst bijvoorbeeld kleiner, terwijl het vergroten ervan de geselecteerde tekst groter maakt. Dit is handig als koppen, productnamen, beschrijvingen of knoppen te groot of te klein lijken voor je winkelontwerp.Typografietips
- Upload een
WOFF2-lettertypebestand als je een aangepast lettertype gebruikt. - Kies tekststijlen die gemakkelijk te lezen zijn.
- Gebruik hoofdlettergebruik voorzichtig, vooral voor langere tekst.
- Pas de grootteschaal aan als koppen, menu-items of knoppen er te groot of te klein uitzien.
- Controleer langere productnamen en -beschrijvingen voordat je opslaat.
- Controleer altijd de mobiele preview voordat je opslaat.
Typografiewijzigingen kunnen de spatiëring en lay-out beïnvloeden, vooral op mobiel. Controleer altijd de mobiele preview voordat je opslaat.
Knoppen
Met de sectie Knoppen kun je het uiterlijk van de klantgerichte knoppen op je bestelpagina aanpassen. Knoppen worden gebruikt voor belangrijke klantacties, zoals items aan de winkelmand toevoegen, de winkelmand bekijken, de checkout starten en een bestelling plaatsen.Knoptips
- Gebruik kleuren die duidelijk opvallen tegen de pagina-achtergrond.
- Zorg dat de knoptekst gemakkelijk leesbaar is.
- Controleer belangrijke acties zoals Add to basket, View basket en checkout-knoppen.
- Vermijd knopkleuren die vermengen met de pagina.
Kleuren
Met de sectie Kleuren kun je het kleurenpalet van je bestelpagina aanpassen. Kleurinstellingen beïnvloeden het algemene thema, achtergronden, tekst, accenten, knoppen, menu-items, modifiers en andere klantgerichte elementen.Presets
Presets laten je snel een vooraf gedefinieerd kleurenthema op je bestelpagina toepassen. Dit kan handig zijn als je wilt beginnen met een kant-en-klare stijl, zoals een minimaal thema, een dark mode-thema of een ander vooraf ingesteld palet, voordat je meer gedetailleerde kleurwijzigingen aanbrengt.Nadat je een preset hebt gekozen, kun je nog steeds individuele kleurvelden handmatig aanpassen.
Contrastwaarschuwingen tonen
De schakelaar Show contrast warnings markeert tekst- en achtergrondkleurcombinaties die mogelijk moeilijk te lezen zijn. Wanneer ingeschakeld, controleert Design & Branding of geselecteerde kleurcombinaties voldoen aan de WCAG AA-contrastrichtlijn.Contrastwaarschuwingen markeren tekst-/achtergrondparen die niet voldoen aan WCAG AA-contrast:
4.5:1 voor standaardtekst en 3:1 voor grote tekst. Streef naar AA of hoger om leesbaarheid voor alle gebruikers te garanderen.Kleurinstellingen
Kleurtips
- Begin met een preset als je een snel thema wilt, en pas dan individuele kleuren aan zoals nodig.
- Gebruik waar mogelijk je merkkleuren.
- Gebruik exacte hex-codes als je merkrichtlijnen hebt.
- Zet Show contrast warnings aan tijdens het bewerken.
- Zorg dat tekst leesbaar blijft tegen de achtergrond.
- Controleer knoppen, winkelmand, checkout, meldingen, modifiers en productbeschrijvingen.
- Bekijk op mobiel voordat je opslaat.
Layout
Layout-instellingen bepalen hoe je bestelpagina is opgemaakt en hoe klanten door je menu, winkelmand en header bladeren. De Layout-sectie bevat:- Menu
- Menu-items
- Basket
- Header-stijl
Menu
Met de sectie Menu kun je aanpassen hoe je menu aan klanten wordt getoond. Je kunt de algemene itemopmaak kiezen, aanpassen hoeveel kolommen op desktop en mobiel worden getoond, de afbeeldingsgrootte bepalen, de itemrichting kiezen en beslissen hoe categorienavigatie-afbeeldingen verschijnen.Menu-opmaakwijzigingen beïnvloeden hoe klanten door je menu bladeren. Controleer altijd zowel de desktop- als de mobiele preview voordat je opslaat.
Items-opmaak
Items-opmaak regelt de algehele structuur die wordt gebruikt om menu-items weer te geven.Menu-opmaak aanpassen
Met de Customise-opties kun je de geselecteerde opmaak in meer detail aanpassen.Itemrichting
Itemrichting regelt hoe de afbeelding en tekst binnen elk menu-item zijn gerangschikt.Categorienavigatie-afbeeldingen
Categorienavigatie-afbeeldingen regelen of categorie-afbeeldingen worden getoond in de menunavigatie.Menutips
- Kies een opmaak die past bij de grootte en stijl van je menu.
- Gebruik lijst- of compacte opmaken voor eenvoudigere menu’s.
- Gebruik kaart- of rasteropmaken als je menu sterk vertrouwt op afbeeldingen.
- Houd mobiele kolommen gemakkelijk te bladeren. Eén kolom is meestal duidelijker voor langere itemnamen of -beschrijvingen.
- Controleer producten met lange namen, lange beschrijvingen, modifiers en afbeeldingen voordat je opslaat.
- Schakel het valutasymbool in als prijzen zonder dit onduidelijk zijn.
- Zorg bij gebruik van categorienavigatie-afbeeldingen dat categorie-afbeeldingen duidelijk en consistent zijn.
- Bekijk zowel desktop als mobiel voordat je opslaat.
Design & Branding bepaalt hoe je menu wordt gepresenteerd. Productnamen, prijzen, modifiers, afbeeldingen en beschikbaarheid moeten mogelijk worden bijgewerkt vanuit de menu-editor of een andere relevante zone van de admin.
Menu-items
Met de sectie Menu-items kun je aanpassen hoe individuele producten op je bestelpagina verschijnen en hoe itemdetails worden getoond wanneer een klant een item opent. Dit omvat item-modal-opmaak, modifier-weergave, weergave van lage voorraad, allergenenweergave, macro-informatie, leeftijdsgates en hoeveel regels itemtekst worden getoond.Menu-iteminstellingen beïnvloeden hoe klanten producten bekijken en selecties maken. Controleer altijd items met afbeeldingen, modifiers, allergenen en lange beschrijvingen voordat je opslaat.
Item-modal
De item-modal is het pop-up- of item-detailoverzicht dat klanten zien wanneer ze een menu-item selecteren.Modal-afbeeldingsstijl
Modal-desktopweergave
Contentpositie
Modifiers-stijl
Modifier-stijl regelt hoe itemopties en modifier-groepen verschijnen wanneer klanten een item aanpassen.Weergave lage voorraad
Weergave lage voorraad regelt of klanten resterende voorraadinformatie kunnen zien voor items met beperkte voorraad.Gebruik voorraadweergave-opties alleen als voorraadniveaus actief worden bijgehouden en nauwkeurig zijn.
Allergenenweergave
Allergenenweergave regelt hoe allergenen-informatie op menu-items verschijnt.Macro-calculator
Macro-calculator regelt of nutritionele macro-informatie aan klanten wordt getoond, waar beschikbaar.Leeftijdsgate
Leeftijdsgate regelt of klanten wordt gevraagd hun leeftijd te bevestigen voordat ze bepaalde items bekijken of bestellen.Line clamp menu-itemnaam
Line clamp menu-itemnaam regelt hoeveel regels van de itemnaam worden getoond voordat de tekst wordt ingekort.
Het instellen op
1 houdt itemnamen bijvoorbeeld waar mogelijk op één regel. Het verhogen van het aantal maakt het mogelijk dat langere itemnamen vollediger worden weergegeven.
Item-beschrijvingsregels
Item-beschrijvingsregels regelen hoeveel regels van de itembeschrijving worden getoond in de menu-item-preview.
Dit kan handig zijn als je een schonere menu-opmaak wilt of als beschrijvingen erg lang zijn.
Menu-item-tips
- Controleer producten met lange namen.
- Controleer producten met lange beschrijvingen.
- Bekijk items met modifiers of opties.
- Controleer items met productafbeeldingen.
- Controleer allergenenweergave waar allergenen-informatie wordt gebruikt.
- Gebruik lage voorraadweergave alleen als voorraad nauwkeurig is.
- Wees voorzichtig met leeftijdsgate-instellingen en gebruik ze alleen waar geschikt.
- Controleer de item-modal op desktop en mobiel voordat je opslaat.
- Vermijd opmaken die het menu te overvol laten voelen op mobiel.
Design & Branding bepaalt hoe menu-items worden weergegeven. Productnamen, prijzen, beschrijvingen, afbeeldingen, modifiers, allergenen, voorraad en beschikbaarheid moeten mogelijk worden bijgewerkt vanuit de menu-editor of een andere relevante zone van de admin.
Winkelmand
Met de sectie Basket kun je aanpassen hoe de winkelmand van de klant verschijnt tijdens de bestelreis. Winkelmand-instellingen beïnvloeden hoe klanten geselecteerde items bekijken, prijzen zien en verder gaan naar checkout.De winkelmand is een belangrijk onderdeel van checkout. Zorg dat klanten hun items duidelijk kunnen bekijken en hun bestelling kunnen plaatsen.
Itemafbeeldingen
Itemafbeeldingen regelen of productafbeeldingen worden getoond in de winkelmand.Itemafbeeldingen aanpassen
Met de Customise-optie kun je de winkelmandafbeeldingsgrootte fijnafstellen.Prijzen
Prijsweergave regelt hoe prijzen in de winkelmand verschijnen.Auto-breedte checkout-knop
De instelling Auto-width checkout button verandert de breedte van de checkout-knop op mobiel. Wanneer ingeschakeld, gebruikt de checkout-knop een op inhoud aangepaste zwevende knop in plaats van een knop met volledige breedte op mobiel.Winkelmand-tips
- Gebruik itemafbeeldingen als ze klanten helpen producten snel te herkennen.
- Verberg itemafbeeldingen als de winkelmand te overvol aanvoelt.
- Houd prijzen zichtbaar tenzij er een specifieke reden is om ze te verbergen.
- Controleer de winkelmand met meerdere items voordat je opslaat.
- Controleer de winkelmand met modifiers of item-opties.
- Bekijk de checkout-knop op mobiel.
- Zorg dat de checkout-knop gemakkelijk te zien en aan te tikken is.
Header-stijl
Met de sectie Header-stijl kun je de bovenkant van je bestelpagina aanpassen. De header is een van de eerste dingen die klanten zien wanneer ze je bestelpagina openen, dus het heeft een sterke impact op de algehele look en feel van je winkel.Wat je kunt aanpassen
Header-tips
- Controleer of je logo duidelijk zichtbaar is.
- Gebruik een header-afbeelding die goed werkt op zowel desktop als mobiel.
- Houd belangrijke afbeeldingsinhoud gecentreerd.
- Vermijd header-afbeeldingen met tekst dicht bij de randen.
- Controleer hoe de header eruitziet na scrollen, vooral als een sticky navigatiebalk wordt gebruikt.
Header-afbeeldingen kunnen anders worden weergegeven afhankelijk van het schermformaat. Controleer altijd de mobiele preview voordat je opslaat.
Inhoud
Content-instellingen bepalen extra informatie die op je bestelpagina wordt getoond. De Content-sectie bevat:- Description
- Notices
- Order status
- Custom sections
Description
Met de sectie Description kun je de locatiebeschrijving die op je bestelpagina wordt getoond bijwerken. Je kunt de beschrijving gebruiken om je locatie te introduceren, je keuken uit te leggen of nuttige bestelinformatie te verstrekken.Beschrijvingstips
- Houd de beschrijving duidelijk en beknopt.
- Gebruik klantvriendelijke bewoording.
- Vermijd lange alinea’s.
- Neem geen informatie op die snel verouderd kan raken tenzij je deze wilt onderhouden.
- Controleer hoe de beschrijving op mobiel verschijnt.
Voorbeeldgebruik
Je kunt de beschrijving gebruiken voor:- Een korte locatie-introductie
- Keukenstype
- Bestelinstructies
- Merkboodschap
- Nuttige service-informatie
Meldingen
Met de sectie Notices kun je klantgerichte berichten toevoegen aan je bestelpagina. Meldingen kunnen worden gebruikt voor belangrijke updates, service-informatie of berichten die klanten moeten zien voordat ze bestellen.Menu-melding
De Menu notice wordt onderaan je menu getoond. Het wordt meestal gebruikt voor informatie zoals allergenen, calorieën of servicekosten.Gesloten-melding
De Closed message wordt getoond wanneer je winkel gesloten of snoozed is. Hiermee kun je het bericht aanpassen dat klanten zien wanneer bestellen momenteel niet beschikbaar is.Opmaak en links
Beide meldingen ondersteunen basisopmaakopties:- Vet
- Cursief
- Onderstreept
- Hyperlinks
Zorg dat alle links die je toevoegt correct en klantgericht zijn voordat je opslaat.
Meldingstips
- Houd meldingen kort en duidelijk.
- Gebruik de menu-melding voor informatie gerelateerd aan het menu, zoals allergenen, calorieën of servicekosten.
- Gebruik het gesloten-bericht om uit te leggen waarom bestellen niet beschikbaar is of wanneer klanten het opnieuw moeten proberen.
- Verwijder of update tijdelijke meldingen wanneer ze niet meer relevant zijn.
- Controleer of meldingen niet conflicteren met je openingstijden, menu of service-instellingen.
- Bekijk meldingen op mobiel voordat je opslaat.
Bestelstatus
Met de sectie Order status kun je aanpassen of er een kaart wordt getoond op de bestelstatus-pagina van de klant. Dit kan klanten helpen locatie- of bezorgingsgerelateerde informatie te begrijpen nadat ze een bestelling hebben geplaatst.Zichtbaarheid van de kaart
Zichtbaarheid van de kaart regelt of de kaart wordt getoond of verborgen op de bestelstatus-pagina.Kaart
De kaartinstellingen laten je aanpassen hoe de kaart verschijnt.Bestelstatus-tips
- Gebruik Visible als de kaart klanten helpt locatie- of bezorginformatie te begrijpen.
- Gebruik Hidden als de kaart niet nodig is voor je bestelstroom.
- Controleer de bestelstatus-pagina na het opslaan, indien mogelijk.
- Zorg dat elke kaartmarker of locatie die wordt getoond nauwkeurig is.
De kaart verschijnt mogelijk alleen waar deze wordt ondersteund door de bestelstatus-pagina en je winkelinstellingen.
Aangepaste secties
Met het gebied Custom sections kun je extra inhoudsblokken aan je bestelpagina toevoegen. Aangepaste secties kunnen worden gebruikt om promoties te benadrukken, visuele content toe te voegen, locatie-informatie te delen of aanvullende klantgerichte berichten op te nemen die niet passen in de standaardbeschrijving of meldingen.Aangepaste secties moeten worden ingeschakeld door storekit Support. Neem contact op met storekit Support om deze functie aan je account toe te voegen.
Een sectie toevoegen
Je kunt kiezen uit verschillende sectiesjablonen:Aangepaste secties bewerken
Nadat je een sectie hebt toegevoegd, kun je de inhoud en het ontwerp bewerken vanuit de aangepaste sectie-editor. Beschikbare besturingselementen kunnen zijn:Aangepaste secties ondersteunen hyperlinks. Zorg dat alle links die je toevoegt correct en klantgericht zijn voordat je opslaat.
Hero
De sectie Hero voegt een grote visuele banner toe aan de bestelpagina. Het is handig om je locatie te introduceren, een sterke merkafbeelding te tonen of een belangrijke boodschap naast het menu te benadrukken. Veelvoorkomende toepassingen zijn:- Welkomstberichten
- Merkintroducties
- Seizoenscampagnes
- Featured beeldmateriaal
- Impactvolle visuele inhoud
Hero-tips
- Gebruik een landschapsafbeelding van hoge kwaliteit.
- Houd belangrijke afbeeldingsinhoud gecentreerd.
- Gebruik korte, duidelijke koptekst.
- Controleer of tekst leesbaar blijft over de afbeelding.
- Gebruik een overlay als de achtergrondafbeelding de tekst moeilijk leesbaar maakt.
- Controleer zowel desktop- als mobiele preview voordat je opslaat.
Call to action
De sectie Call to action is ontworpen om klanten aan te moedigen een specifieke actie te ondernemen. Het bevat meestal een korte boodschap en een link- of knopachtige aanwijzing, zoals nu bestellen of een menu bekijken. Veelvoorkomende toepassingen zijn:- Klanten aanmoedigen om te bestellen
- Bezorging of afhaal promoten
- Linken naar een specifieke pagina
- Een campagne markeren
- Klanten doorverwijzen naar een andere service
Call to action-tips
- Houd het bericht kort en direct.
- Maak de actie duidelijk.
- Gebruik een link als klanten ergens anders naartoe moeten.
- Controleer of de call-to-action-tekst gemakkelijk leesbaar is.
- Zorg dat de sectie er goed uitziet op mobiel.
Info card
De sectie Info card is handig voor eenvoudige informatieve content. Het kan worden gebruikt om details te tonen die klanten mogelijk nodig hebben voordat ze bestellen. Veelvoorkomende toepassingen zijn:- Openingstijden
- Bezorginformatie
- Afhaalinstructies
- Servicebeschikbaarheid
- Locatie-opmerkingen
- Contactgegevens
Info card-tips
- Houd de informatie beknopt.
- Vermijd het toevoegen van te veel tekst.
- Zorg dat de details overeenkomen met je winkelinstellingen.
- Werk de kaart bij als de informatie verandert.
- Controleer de mobiele preview voordat je opslaat.
Announcement
De sectie Announcement voegt een gemarkeerd bericht toe aan de bestelpagina. Het is handig voor promoties, tijdelijke updates of belangrijke berichten die moeten opvallen. Veelvoorkomende toepassingen zijn:- Aanbiedingen voor beperkte tijd
- Gratis bezorgpromoties
- Service-updates
- Vakantieberichten
- Tijdelijke wijzigingen
- Belangrijke herinneringen
Announcement-tips
- Houd aankondigingen kort.
- Verwijder of werk tijdelijke aankondigingen bij wanneer ze niet meer relevant zijn.
- Zorg dat promotionele details nauwkeurig zijn.
- Controleer of de aankondiging niet conflicteert met meldingen, menu-instellingen of service-instellingen.
- Gebruik leesbare kleuren met sterk contrast.
About us
Met de sectie About us kun je meer delen over je locatie, merk, eten of verhaal. Het is handig om persoonlijkheid toe te voegen aan je bestelpagina en klanten te helpen te begrijpen wat je locatie uniek maakt. Veelvoorkomende toepassingen zijn:- Locatieverhaal
- Merkboodschap
- Voedselfilosofie
- Lokale sourcing-informatie
- Communityboodschap
- Restaurantachtergrond
About us-tips
- Houd de tekst klantvriendelijk.
- Vermijd lange alinea’s.
- Gebruik een sterke afbeelding die je locatie weerspiegelt.
- Zorg dat de tekst leesbaar blijft over de achtergrond.
- Controleer de sectie op mobiel voordat je opslaat.
Aangepaste sectie-tips
- Gebruik aangepaste secties om de bestelervaring te ondersteunen, niet om ervan af te leiden.
- Houd content kort en relevant.
- Vermijd het toevoegen van te veel secties.
- Gebruik afbeeldingen van hoge kwaliteit.
- Controleer tekstcontrast over afbeeldingen.
- Zorg dat hyperlinks werken voordat je opslaat.
- Bekijk de volledige bestelpagina op mobiel voordat je opslaat.
Best practices
Begin met presets en pas dan aan
Voor kleuren, begin met een preset als je een snel thema wilt, en pas dan individuele kleurvelden handmatig aan. Zet Show contrast warnings aan tijdens het bewerken, zodat je kunt controleren of tekst- en achtergrondkleurcombinaties gemakkelijk te lezen zijn.Controleer interactieve elementen
Controleer voor het opslaan belangrijke klantacties zoals:- Toevoegen aan winkelmand
- Modifier-selectie
- Geselecteerde modifier-kaarten
- Winkelmand bekijken
- Checkout
- Bestelstatus-pagina
- Aangepaste sectie-links
Controleer beperkte of gevoelige inhoud
Als je leeftijdsgates, allergenenweergave, weergave lage voorraad of macro-informatie gebruikt, zorg dan dat de informatie nauwkeurig is voordat je opslaat. Besteed extra aandacht aan:- Allergenenlabels
- Voorraadniveaus
- Items met leeftijdsgate
- Nutritionele of macro-informatie
- Prijszichtbaarheid in de winkelmand
Houd aangepaste secties gefocust
Aangepaste secties moeten de bestelervaring ondersteunen. Gebruik ze voor nuttige klantgerichte informatie zoals:- Promoties
- Openingstijden
- Bezorg- of afhaalinformatie
- Locatieverhaal
- Allergenen- of service-informatie
- Calls to action
Controleer mobiele preview
De meeste klanten bestellen vanaf mobiele apparaten, dus controleer altijd de mobiele preview voordat je opslaat. Besteed extra aandacht aan:- Bijsnijden van header-afbeelding
- Logo-zichtbaarheid
- Menu-opmaak
- Menu-itemkaarten
- Item-modals
- Modifier-selectie
- Zichtbaarheid van winkelmand
- Opmaak van checkout-knop
- Leesbaarheid van knoppen
- Meldingen
- Aangepaste secties
- Bestelstatus-kaart, waar gebruikt
Gebruik duidelijke afbeeldingen
Voor het beste resultaat:- Gebruik vierkante afbeeldingen voor logo’s en favicons.
- Gebruik landschapsafbeeldingen voor headers.
- Houd belangrijke afbeeldingsinhoud gecentreerd.
- Vermijd afbeeldingen met veel tekst.
- Vermijd het uploaden van afbeeldingen die wazig of van lage kwaliteit zijn.
Houd tekst beknopt
Lange tekst kan je bestelpagina moeilijker te gebruiken maken, vooral op mobiel. Probeer het volgende kort en duidelijk te houden:- Winkelbeschrijvingen
- Meldingen
- Aangepaste secties
- Productbeschrijvingen
Prioriteer leesbaarheid
Zorg bij het kiezen van lettertypen en kleuren dat klanten het volgende gemakkelijk kunnen lezen:- Productnamen
- Productbeschrijvingen
- Prijzen
- Meldingen
- Winkelmandtotalen
- Checkout-knoppen
Houd de bestelreis duidelijk
Ontwerpwijzigingen moeten bestellen makkelijker maken, niet moeilijker. Controleer voor het opslaan of klanten gemakkelijk kunnen:- Door het menu bladeren
- Productopties begrijpen
- Items aan de winkelmand toevoegen
- Hun winkelmand bekijken
- Verder gaan naar checkout
- Een bestelling plaatsen
Probleemoplossing
Een sectie is vergrendeld of niet beschikbaar
Sommige Design & Branding-secties zijn alleen beschikbaar met storekit+. Als een sectie in je admin vergrendeld is, neem contact op met storekit Support om deze functie aan je account toe te voegen. Een storekit+-abonnement is vereist.Mijn tekst is moeilijk te lezen over een afbeelding
Als tekst moeilijk te lezen is over een header-afbeelding, hero-sectie of aangepaste sectie-afbeelding, probeer dan:- Een donkerdere of lichtere overlay te gebruiken
- De tekstkleur te veranderen
- Een eenvoudigere afbeelding te kiezen
- Belangrijke tekst weg te houden van drukke delen van de afbeelding
- De sectie op mobiel te controleren
Mijn menu ziet er overvol uit op mobiel
Als het menu te overvol aanvoelt, controleer dan:- Mobiele kolommen
- Afbeeldingsformaat
- Itemrichting
- Grote afbeeldingen
- Item-beschrijvingsregels
- Line clamp menu-itemnaam
- Categorienavigatie-afbeeldingen
Mijn item-modal ziet er te groot of moeilijk te gebruiken uit
Controleer:- Modal-afbeeldingsstijl
- Modal-desktopweergave
- Contentpositie
- Modifier-stijl
- Modal-rand
- Itemafbeeldingsformaat
- Mobiele preview
Modifier-opties zijn moeilijk te begrijpen
Controleer de geselecteerde modifier-stijl. Als modifier-opties moeilijk te scannen zijn, probeer dan een eenvoudigere opmaak of zorg dat modifier-namen en -afbeeldingen duidelijk zijn.Lage voorraad- of voorraadinformatie ziet er verkeerd uit
Weergave van lage voorraad en voorraad mag alleen worden gebruikt als voorraadniveaus nauwkeurig en actief worden onderhouden. Als de aantallen er verkeerd uitzien, controleer dan de item-voorraadinstellingen voordat je de weergavestijl wijzigt.Allergenen-informatie ontbreekt of is onduidelijk
De allergenenweergave regelt hoe allergenen-informatie verschijnt, maar de allergenen-details zelf moeten mogelijk worden beheerd in de relevante menu-iteminstellingen. Controleer of allergenen-informatie nauwkeurig is voordat je op de weergave vertrouwt.De winkelmand toont prijzen niet zoals verwacht
Controleer de instelling Prices in de Basket-sectie. Winkelmandprijzen kunnen worden ingesteld op:- Show all
- Hide basket total
- Hide all
Mijn aangepaste sectielink werkt niet
Controleer of de hyperlink correct en klantgericht is. Zorg dat de link waar nodig de volledige URL bevat, sla vervolgens op en test deze op de live bestelpagina.De bestelstatus-kaart wordt niet getoond
Controleer:- Zichtbaarheid van de kaart is ingesteld op Visible
- De bestelstatus-pagina ondersteunt de kaart voor je winkelinstellingen
- De kaartmarker of locatie is correct geconfigureerd
Mijn wijzigingen verschijnen in de preview maar niet op de live bestelpagina
Zorg dat je op Save hebt geklikt. De preview wordt bijgewerkt terwijl je wijzigingen maakt, maar je live bestelpagina wordt pas bijgewerkt totdat de wijzigingen zijn opgeslagen. Ververs na het opslaan je live bestelpagina en controleer of je de juiste winkel bekijkt.Mijn afbeelding lijkt bijgesneden
Sommige afbeeldingen, vooral header-afbeeldingen, worden automatisch bijgesneden om op verschillende schermformaten te passen. Controleer de mobiele preview en gebruik een afbeelding waar de belangrijkste inhoud gecentreerd is.Vermijd het plaatsen van belangrijke tekst, logo’s of gezichten dicht bij de rand van header-afbeeldingen, aangezien ze op kleinere schermen kunnen worden bijgesneden.
Mijn logo of favicon ziet er vervormd uit
Gebruik een vierkante afbeelding voor logo’s en favicons. Transparante PNG-bestanden werken meestal het beste voor logo’s.Mijn kleuren zijn moeilijk te lezen
Controleer het contrast tussen je tekst, achtergrond en knoppen. Klanten moeten duidelijk kunnen lezen:- Productnamen
- Productbeschrijvingen
- Prijzen
- Meldingen
- Winkelmandtotalen
- Checkout-knoppen
Mijn knoppen vallen niet op
Knopkleuren moeten duidelijk zichtbaar zijn tegen de pagina-achtergrond. Controleer belangrijke klantacties zoals:- Toevoegen aan winkelmand
- Winkelmand bekijken
- Checkout
- Bestelling plaatsen
De mobiele versie ziet er niet goed uit
Schakel over naar mobiele preview en controleer:- Bijsnijden van header-afbeelding
- Logo-zichtbaarheid
- Menu-categorienavigatie
- Productkaartopmaak
- Zichtbaarheid van winkelmand
- Leesbaarheid van knoppen
- Meldingen en aangepaste secties
Mijn melding is niet meer relevant
Als een melding werd toegevoegd voor een tijdelijke update, denk er dan aan om deze te verwijderen of bij te werken zodra deze niet meer van toepassing is. Voorbeelden zijn:- Vakantie-openingsupdates
- Bezorgvertragingsberichten
- Tijdelijke sluitingsberichten
- Alleen-afhaalberichten
- Keukenprobleem-meldingen
Mijn pagina voelt te rommelig aan
Te veel content kan de bestelpagina moeilijker te gebruiken maken. Controleer of je het volgende kunt inkorten of verwijderen:- Lange beschrijvingen
- Meerdere meldingen
- Te veel aangepaste secties
- Afbeeldingen met veel tekst
- Herhaalde informatie
Wanneer contact opnemen met storekit Support
Neem contact op met storekit Support als:- Een instelling niet opslaat.
- De live pagina niet wordt bijgewerkt na opslaan.
- Een Design & Branding-sectie vergrendeld is en je deze wilt inschakelen.
- Je een functie wilt toevoegen die storekit+ vereist.
- Je de ontwerpoptie die je nodig hebt niet kunt vinden.
- Een afbeelding of kleur niet correct wordt weergegeven.
- Tekst of knoppen moeilijk leesbaar blijven na bewerken.
- Je bestelpagina er kapot uitziet na het maken van wijzigingen.
- Een aangepaste sectie niet wordt weergegeven zoals verwacht.
- Een hyperlink in een melding of aangepaste sectie niet werkt.
- De bestelstatus-kaart niet verschijnt zoals verwacht.
- Je hulp nodig hebt bij het aanpassen van een ontwerpelement dat niet beschikbaar is in Design & Branding.