Ga naar hoofdinhoud

Winkelwagen

De winkelwagen (bereikbaar via /cart) is de laatste stap voordat een klant gaat afrekenen. Op deze pagina zien bezoekers een overzicht van de gekozen producten, kunnen ze aantallen aanpassen en worden de totale kosten berekend.

De pagina is opgedeeld in twee delen: de linkerkolom met de producten, en de rechterkolom met het totale kostenoverzicht en de bestelknop. De rechterkolom bouw je modulair op met blokken.

Algemene Layout & Vormgeving​

Via de hoofdinstellingen van de winkelwagen-sectie beheer je de algemene weergave en de linkerkolom met producten:

  • Kleurenschema's: Je kunt de achtergrondkleur van de gehele pagina (Algemeen kleurenschema) en de kleur van de losse productkaarten apart van elkaar instellen.
  • Introductie: Bepaal de titel bovenaan de pagina (bijv. "Jouw Winkelwagen"), pas de lettergrootte en dikte aan, en voeg eventueel een extra inleidende tekst toe.
  • Productweergave: Stel de grootte (in pixels) van de productafbeelding in en bepaal hoe groot en dik de producttitels weergegeven moeten worden.
  • Lege Winkelwagen: Bepaal wat bezoekers zien als ze nog geen producten hebben toegevoegd. Je kunt een speciale titel, een begeleidende tekst en de tekst voor de "Verder winkelen" knop instellen.

Het Besteloverzicht (Blokken)​

De rechterkolom van de winkelwagen (het overzicht met de afreken-knop) bouw je op door middel van verschillende blokken. Je kunt de volgorde hiervan zelf bepalen door ze te verslepen.

Afrekenen (Proceed to checkout)​

Dit is het belangrijkste blok. Hierin staat de totale prijs, eventuele kortingen en de grote knop om naar de kassa te gaan.

  • Vormgeving: Kies een specifiek kleurenschema voor dit kaartje en een apart kleurenschema voor de afreken-knop zelf.
  • Algemene Voorwaarden: Vink aan of klanten eerst verplicht akkoord moeten gaan met de algemene voorwaarden voordat ze kunnen afrekenen. Je kunt ook instellen of dit vinkje standaard al is aangevinkt.
  • Opmerkingen (Cart note): Schakel een open tekstveld in waar klanten een opmerking of speciale instructie bij hun bestelling kunnen achterlaten (bijv. "Laat het pakketje bij de achterdeur achter").

Titel​

Een simpel blok om extra kopteksten in je rechterkolom toe te voegen, bijvoorbeeld "Verzending & Service" vlak boven je USP's.

  • Tekstopmaak: Vul je tekst in en bepaal of deze normaal of dikgedrukt moet zijn.
  • Marge onderkant: Verwijder de witruimte aan de onderkant als je wilt dat de tekst strak boven het volgende element staat.

USP​

Wek extra vertrouwen nét voordat de klant gaat afrekenen.

  • Icoon & Kleur: Kies een FontAwesome icoon (bijv. een vinkje of een vrachtwagen) en bepaal in welke themakleur dit icoon getoond moet worden (bijv. 'success' voor groen).
  • Tekst: Vul je voordeel in, zoals "Voor 23:00 besteld, morgen in huis".
  • Marge onderkant: Verwijder de marge om meerdere USP's strak onder elkaar te groeperen.

App Blokken​

Gebruik dit blok om functionaliteiten van externe Shopify apps in je winkelwagen overzicht te laden, zoals speciale kortings-apps of upsell-widgets.