With the content toggle you give visitors the ability to switch between two views on your page. Ideal for a pricing table with a monthly and annual subscription: the visitor clicks the toggle and immediately sees the matching prices.
How does it work?
The 'content toggle' is built into a number of pricing block templates in the page builder. You can't add this toggle as a separate element; you choose a template that already includes a content toggle.
Each toggle is linked to two rows. If a visitor clicks option 1, they see the content of row 1 and row 2 is hidden. If they click option 2, row 2 appears and row 1 is hidden.
Using the content toggle
Go to your landing page and add a new block. Choose a Pricing block template with a content toggle. There are currently two templates to choose from π
Click the content toggle in the block to edit it. The options in the toggle can be adjusted in the panel on the left. Here you can change the title and label (a discount percentage, for example), or add an extra option.
To change the content of each option, click the title in the toggle. In the example below, I can now adjust the content shown under Monthly.
π‘ Tip: Use the content toggle for a monthly/annual switch in your pricing table. This way you show both options without visitors having to scroll.
Linking a checkout
The buttons in your pricing table will need to be linked to a checkout, of course. Click the button to link an existing checkout right away.
In the left panel, choose Checkout under Type and select your checkout.
Can I show only the monthly or only the annual option on the checkout?
To ensure that the correct subscription option (monthly/annual) is automatically selected on the checkout, add a parameter.
Monthly subscription:
?plan=monthlyAnnual subscription:
?plan=yearly
When your visitor has clicked the Annual option and goes to the checkout, this choice is preselected and your visitor can no longer choose Monthly on the checkout.
That way, the visitor doesn't have to choose between monthly and annual again on the checkout. This makes it easier for your visitor to pay straight away!
Example
Our checkout for Plug&Pay Premium normally includes the choice between monthly and annual. If I add the parameter ?plan=yearly to the button on the landing page, the visitor automatically gets the annual subscription as the option.







