Het Discount code-blok is een invoerveld waar shoppers een promocode kunnen invoeren en toepassen in de cart, zodat ze de korting al zien voordat ze naar de checkout gaan.
- Bij toepassen wordt de code getrimd, in hoofdletters gezet en naar Shopify verzonden. Omdat Shopify het verzoek accepteert ongeacht of de code geldig is, controleert het blok daarna de cart opnieuw om te bevestigen dat de code daadwerkelijk is toegepast.
- Geldig → het veld wordt leeggemaakt en de korting wordt toegepast.
- Ongeldig → het blok toont “Invalid discount code.”
- Hoe een code stapelt met andere kortingen (automatische kortingen, andere codes) wordt volledig door Shopify afgehandeld — het blok past de code alleen toe.
- Toegepaste codes worden getoond in het Summary-blok, niet hier.
- Regio: midden of onder.
- Maximum: 1 per cart-status — de gevulde cart en de lege cart hebben elk hun eigen limiet.
- Status: zowel gevuld als leeg.
- Niet standaard toegevoegd. Niet vergrendeld — je kunt het verwijderen of verbergen.
Ondersteunt een aangepaste template via het tabblad Code, die de ingebouwde markup van dit blok vervangt door jouw JSX. Dit zijn de props die het ontvangt.
Koppel zowel setDiscountCodeInput als handleSubmit. Zonder de eerste kan er niet in het veld worden getypt; zonder de tweede wordt een code nooit toegepast.
Style dit blok met de sectie Design in het instellingenpaneel. Dit zijn overrides per blok die bovenop je globale design komen en erop terugvallen wanneer ze leeg zijn.
Wat zijn designinstellingen? Lees er hier meer over: Designinstellingen.