Product add-on-blok

Het Product add-on-blok biedt één specifiek product dat jij kiest aan als add-on in de winkelwagen, waarmee je één bekend product (een garantie, een sample, een bestseller) promoot als quick add direct in de winkelwagen.

• Als er geen live variant kan worden bepaald — het product is niet ingesteld, gearchiveerd of niet op voorraad — rendert het blok niets in plaats van een dode knop.
• De bedieningsknop weerspiegelt of de add-on-regel van dit blok zelf in de winkelwagen zit, dus uitschakelen verwijdert de regel die het blok heeft toegevoegd (en heeft geen invloed op hetzelfde product dat elders is toegevoegd).
• Een vergelijkingsprijs (compare-at) wordt doorgestreept wanneer er een echte prijsverlaging is; het ”% off”-label wordt verborgen als de korting afgerond onder de 1% uitkomt.
• De add-on-afbeelding valt terug op de uitgelichte afbeelding van het product wanneer de gekozen variant er geen heeft.

Title, Price label en Description ondersteunen alle drie dezelfde vier tokens: {{product_title}}, {{price}}, {{compare_at_price}} en {{savings}}.

• Regio: body of onderkant.
• Maximum: 3 per winkelwagenstaat — de gevulde winkelwagen en de lege winkelwagen krijgen elk hun eigen limiet.
• Staat: zowel gevulde als lege winkelwagen.
• 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. Style dit blok via de sectie Design in het instellingenpaneel. Dit zijn overrides per blok die bovenop je globale design komen en erop terugvallen wanneer ze leeg zijn. De sectie Text in Design regelt de typografie van drie elementen. Gebruik de kiezer Text element om ertussen te wisselen. Title — de productnaam. Ondersteunt ook een aangepaste font family. Vet en tekstkleur stel je in de Rich Text Editor hierboven in (op het tabblad Settings), niet hier. Price — de prijsregel. Vet en tekstkleur stel je in de Rich Text Editor hierboven in. Description — de ondersteunende tekst. Vet en tekstkleur stel je in de Rich Text Editor hierboven in. Wat zijn design-instellingen? Lees er hier meer over: Design-instellingen.