How to Create a Modal Checkout

[Note: This feature is available on the Standard (plus the Page Importer) / Pro / Agency / Scale and Maximize Plans. If you need this feature and you would like to upgrade to a different plan please contact us at support@convertri.com]

Video Tutorial:

Article:

A modal checkout is a quick and simple way of integrating product sales in your Convertri page. Instead of configuring every moving part of your checkout, simply choose a few options and Convertri will generate an automatic checkout for you.

NOTE: Before you begin, you must have at least one active product and a payment processor integration.

1. In the Page Builder, add a Button by clicking the Form Elements menu in the Elements tray.
   
2. With the button selected, choose Button Settings in the Properties panel, and click the Button Mode dropdown menu. Click Checkout.
   
3. Click Products in the top toolbar, and choose which product you want to sell on your page. Choose whether this product is a one-click upsell (find out more about that here), enter a credit card statement message, and the URL you want buyers to be taken to after they’ve confirmed their purchase.
   
   You can choose to have your checkout in either live or test mode.  Live mode is used when your checkout is ready to make purchases and complete payment, whereas test mode can be used if you want to run a test. This will allow you to see whether the product is ready to be purchased and will not charge any credit card you will use. You can use the test stripe cards provided from the link. When you’re done, click Next.
   

   

4. Checkout Appearance is where you can customize your Theme and Logo. Click Next.
   

   

5. Enter a call to action or Title. Click Next

   

6. Enter the labels for the Name and Email form, as well as the section header, and choose whether you want to include their phone number. Click Next.

   

7. If you require a billing and/or delivery address, configure this option. Click Next.
   

   

8. Edit the labels for the credit card details, and click Next.
   

   

9. Cart Abandonment, this means if anyone opens your checkout and enters their email address or other details,but does not complete your checkout they will be added to the mailing list for the autoresponder that you select. This is useful to re-target those customers who did not complete the purchase, Click Save and Close.
   

   

Now, when your customers click the button on your page they’ll be taken to the modal checkout, where they can quickly and securely purchase your product using the options you set.

NOTE: The checkout page only shows the sum that your buyer has to pay immediately after clicking your CTA. So, when your product has a free trial, the total will show as zero because you may give them the option to opt-out before the trial ends.