De standaard resultaatpagina toont je resultaatkaarten naast elkaar. Voor de meeste quizzen werkt dat prima. Soms wil je iets dat er anders uitziet en anders verkoopt: een huidverzorgingsroutine in stappen, een starterspakket met één prijs, of een pagina die elk huidtype in eigen woorden aanspreekt. Met een eigen resultaatpagina ontwerp je precies dat, met de producten en prijzen van de klant live ingevuld.
Eigen resultaatpagina's zijn een bètafunctie. Zet eerst de bètafuncties aan.
Een eigen layout aanzetten
- Ga naar Quiz funnels → All quizzes, klik bij je quiz op Edit en open Design quiz.
- Klik op het tabblad Content op Result page.
- Scrol in Result page settings naar Layout en zet Custom layout aan.
- Klik op Create custom layout. Tot je dat doet, blijven klanten de standaard resultaatpagina zien.
Ontwerpen met Barry
De editor opent schermvullend. Links zie je een live preview van de pagina. Rechts staat Barry klaar om hem samen met je te bouwen. Beschrijf in gewone woorden wat je wilt, bijvoorbeeld "Toon de producten als een genummerde ochtendroutine met onderaan een knop om alles in de winkelwagen te leggen". Barry schrijft de pagina en de preview wordt bijgewerkt. Blijf om aanpassingen vragen tot het goed voelt: andere kleuren, een andere volgorde of een regel die alleen bij een droge huid verschijnt.
Met een paar hulpmiddelen controleer je het resultaat:
- Preview answers: kies bovenaan per vraag een antwoord om de pagina te zien die een echte klant met die antwoorden zou krijgen. Antwoorden met "no products" zouden de pagina leeg laten.
- Met de knoppen desktop en mobile rechtsboven wissel je de grootte van de preview. De meeste klanten maken quizzen af op hun telefoon, dus controleer beide.
- Wijzigingen worden automatisch opgeslagen. Sluit de editor als je klaar bent en publiceer je quiz om de nieuwe pagina live te zetten.
Of pas de code zelf aan
Schrijven jij of je developer het liever met de hand, klik dan op Show code. Je krijgt twee velden, HTML en CSS, en de preview wordt bijgewerkt terwijl je typt. Plaatshouders tussen dubbele accolades, zoals {{name}} en {{price}}, worden ingevuld met de producten van elke klant. De CSS geldt alleen voor de resultaatpagina en raakt de rest van je webshop dus niet. Klik op Ask Barry om terug te gaan naar de chat.
Een korting toevoegen
Onder Layout kun je klanten belonen die hun aanbeveling volgen:
- Whole-kit discount: geldt als de klant alle aanbevolen producten koopt.
- Single-product discount: geldt voor elk aanbevolen product dat los wordt gekocht.
Kies per korting Percentage of Fixed amount en typ een Discount code, zoals ROUTINE15. Eén code dekt beide aanbiedingen. bluebarry maakt de code voor je aan in Shopify en past hem toe bij het afrekenen. De kortingen zijn niet te stapelen: een klant die de hele set koopt, krijgt de setkorting. Je pagina kan de aanbieding, de setprijs en de besparing tonen, en die blijven kloppen als je de korting later wijzigt.
Goed om te weten
- Knoppen voor in winkelwagen op je pagina leggen producten direct in de winkelwagen op Shopify, WooCommerce en CCV Shop. Op andere platforms openen ze de productpagina.
- Het quizcanvas in Studio blijft de standaard resultaatkaarten tonen. Open Edit custom layout om je eigen pagina te zien.
- Je resultaatkaarten bepalen nog steeds welke producten verschijnen. Wil je andere producten, pas dan de kaarten en hun regels aan. Zie Resultaatkaarten voor je quiz bouwen.
- Wil je terug naar de standaard resultaatpagina, zet dan Custom layout uit en publiceer. Je eigen pagina blijft bewaard voor als je hem terug wilt.