Naar de hoofdinhoud

Maand- en jaarprijzen tonen in je prijstabel

Laat bezoekers wisselen tussen twee prijsopties op je landingspagina

Geschreven door Bryan Schoenmaker
Vandaag bijgewerkt

Met de content toggle geef je bezoekers de mogelijkheid om zelf te wisselen tussen twee weergaven op je pagina. Ideaal voor een prijstabel met een maand- en jaarabonnement: de bezoeker klikt op de toggle en ziet direct de bijpassende prijzen.


Hoe werkt het?

De 'content toggle' is ingebouwd in een aantal pricing blok templates in de page builder. Je kunt deze toggle dan ook niet los toevoegen als element; je kiest een template die al een content toggle bevat.

Elke toggle is gekoppeld aan twee rijen. Klikt een bezoeker op optie 1? Dan ziet hij de inhoud van rij 1 en is rij 2 verborgen. Klikt hij op optie 2? Dan verschijnt rij 2 en verdwijnt rij 1.


De content toggle gebruiken

Ga naar je landingspagina en voeg een nieuw blok toe. Kies een Pricing blok template met een content toggle. Op dit moment zijn er twee templates waar je uit kan kiezen 👇

Klik op de content toggle in het blok om hem te bewerken. De opties in de toggle zijn in het venster links aan te passen. Hier kan je de titel en het label (bijvoorbeeld een kortingspercentage) aanpassen, of voeg een extra optie toe.

Om de inhoud van elke optie aan te passen, klik je op de titel in de toggle. In onderstaand voorbeeld kan ik nu de inhoud aanpassen die onder Maandelijks valt:

💡 Tip: gebruik de content toggle voor een maand/jaar-schakelaar in je prijstabel. Zo laat je beide opties zien zonder dat bezoekers hoeven te scrollen.


Betaalpagina koppelen

De knoppen in je prijstabel zullen uiteraard gekoppeld moeten worden aan een betaalpagina. Klik op de knop om direct een bestaande betaalpagina te koppelen.

In het linker venster kies je bij Type voor Betaalpagina en selecteer je de juiste betaalpagina.

Kan ik alleen de maand- of jaaroptie tonen op de betaalpagina?

Om ervoor te zorgen dat de juiste abonnementsoptie (maandelijks/jaarlijks) automatisch wordt geselecteerd op de betaalpagina, voeg je een parameter toe.

  • Maandabonnement: ?plan=monthly

  • Jaarabonnement: ?plan=yearly

Wanneer jouw bezoeker de optie Jaarlijks heeft aangeklikt en vervolgens naar de betaalpagina wil gaan, is deze keuze voorgeselecteerd en kan je bezoeker niet meer kiezen voor Maandelijks op de betaalpagina.

Zo hoeft de bezoeker op de betaalpagina niet nog een keer de keuze te maken tussen maandelijks of jaarlijks. Dit maakt het voor je bezoeker makkelijker om gelijk af te rekenen!

Voorbeeld

Onze betaalpagina voor Plug&Pay Premium bevat normaal de keuze tussen maandelijks en jaarlijks. Voeg ik bij de knop op de landingspagina de parameter ?plan=yearly toe, dan krijgt de bezoeker automatisch het jaarabonnement als keuze.

Was dit een antwoord op uw vraag?