Skip to main content

Overzicht

Met deze functie kun je de Express Payment-opties van Shopify tonen (zoals Shop Pay, Apple Pay of Google Pay) voor een snellere checkout-ervaring met de opgeslagen betaalmethoden van de koper. Express- of versnelde checkout-knoppen helpen terugkerende klanten om aankopen sneller af te ronden door het handmatig invoeren van betaal- en verzendgegevens over te slaan. Deze knoppen verschijnen onder de hoofdknop Checkout in de cart en worden aangedreven door Shopify. Upcart ondersteunt deze knoppen visueel en structureel, maar Shopify bepaalt hun gedrag en zichtbaarheid. 📘 Lees meer in Shopify’s documentatie over versnelde checkouts en Shopify’s release-opmerkingen over versnelde checkout-knoppen. Express-knoppen voor Shop Pay, PayPal en Google Pay onder de Upcart checkout-knop

Express Payments zichtbaar krijgen

Om knoppen voor versnelde checkout in Upcart weer te geven, moet je Shopify-thema ze al op de storefront bevatten. Dit doe je door:
  1. Een snippet toe te voegen aan je themacode
    • Ga naar Online Store > Themes > Edit Code
    • Open het bestand layout/theme.liquid
    • Zoek de openende <body>-tag (niet </body>)
    • Plak onder die tag de volgende code:
  2. Sla het bestand op
Hier is een voorbeeld van hoe het eruit moet zien: Het Liquid-snippet voor additional checkout buttons toegevoegd onder de body-tag in theme.liquid Zodra dit is gedaan, kan Upcart je express payment-opties detecteren en weergeven. 💡 Als je liever geen code bewerkt, neem dan contact op met je developer of een Shopify Expert.

Betaalgateways

De kaart Payment gateways hoort bij de legacy Express Payments-module — je ziet deze alleen als je winkel nog op de oudere versie zit. De kaart toont de express-gateways die Upcart in de cart kan weergeven, en laat je elke gateway in- of uitschakelen en de volgorde bepalen waarin ze verschijnen. Er staan zes gateways in de lijst:
  • Shop Pay
  • PayPal
  • Apple Pay
  • Amazon Pay
  • Meta Pay
  • Google Pay — wel vermeld, maar gemarkeerd als Coming Soon en niet selecteerbaar
Google Pay wordt bewust achtergehouden: de knop wordt niet ververst wanneer de cart wijzigt, waardoor iedereen die de cart bewerkt voordat erop wordt geklikt een verouderde prijs zou zien. De andere vijf kunnen worden ingeschakeld en herschikt — ingeschakelde gateways staan in een geordende lijst, gebruik de pijltjes omhoog en omlaag naast elke rij om de volgorde te wijzigen, en uitgeschakelde gateways staan eronder, waar klikken ze weer toevoegt.
Het inschakelen van een gateway hier garandeert niet dat deze wordt getoond. Een gateway wordt in de echte cart verborgen als deze niet is ingeschakeld in je Shopify-winkel, of als de shopper er niet voor in aanmerking komt — een Apple Pay-knop wordt bijvoorbeeld alleen getoond op een ondersteund apparaat en browser. Zie Shopify’s documentatie over versnelde checkouts voor het inschakelen van gateways en de geschiktheidsregels per gateway.

Design van versnelde checkout-knoppen

Zodra je knoppen zijn ingesteld, kun je aanpassen hoe ze in Upcart worden weergegeven.

Knophoogte

  • Default button height en Mobile button height worden apart ingesteld, elk van 25 px tot 55 px
  • Elk heeft een getalveld en een slider die aan dezelfde waarde zijn gekoppeld — gebruik wat het makkelijkst is

Uitlijning van de checkout-knop

  • Kies hoe de express-knoppen worden uitgelijnd:
    • Left
    • Right
    • Center
    • Space Between

Rij-afstand

  • Stel de verticale afstand tussen gestapelde knoppen in, van 0 px tot 40 px

Geavanceerde weergaveopties

Wanneer ingeschakeld, verbergt dit het toestemmingsbericht voor de koper dat normaal wordt weergegeven wanneer een abonnementsproduct in de cart zit. Dit kan visuele rommel verminderen als je gerelateerde informatie al elders aanbiedt.

Cart renderen in Shadow DOM

Schakel dit in om te voorkomen dat de CSS van je Shopify-thema de styling van Upcart verstoort.
Dit zorgt voor een consistent design in alle browsers en op alle apparaten.
Als je dit inschakelt, wordt ook dezelfde instelling toegepast vanuit Settings > Cart settings > Advanced Settings.

Opmerkingen over themacompatibiliteit

  • Shopify hanteert nu strikte stylingregels voor versnelde checkout-knoppen.
  • De nieuwe versie van Upcart ondersteunt deze regels volledig en volgt het stylinggedrag van Shopify.
⚠️ Op de huidige module verschijnt bovenaan een banner Revert To Old Version met een knop Revert To Legacy Express Payments. Deze is alleen nodig voor verouderde thema’s — terugkeren zet je terug naar het gedrag van vóór de Shopify-styling, dus laat de knop met rust tenzij je thema het echt nodig heeft. Als je toch terugkeert, haal dan het vinkje weg bij eventueel opgeslagen stylingopties van de vorige module, zodat ze de nieuwe versie niet verstoren.