If you're building a payment form, you know customization is crucial in order to obtain good results. Today we're looking into dynamic payment forms, so you can build highly personalized payment forms, displaying different prices and executing the transaction according to the user's choice.
Arengu enables you to build dynamic payment forms, connected to Stripe as a payment platform, without coding. Plus, you can add additional server-side actions for a highly advanced form. Let's see this use case in detail:
If you're designing a payment form for your business, you may want to apply dynamic pricing for different reasons. These are some of the main scenarios that require displaying dynamic pricing:
There are many different use cases you can cover with a dynamic payment form. Whatever use case you're targeting, you can cover it by using Arengu and Stripe.
Arengu allows you to build any kind of form for any use case, including advanced logic behind the screens. In order to build payment forms, arengu works along with Stripe, the payment platform.
If you're looking to build much more than a simple payment form, keep reading to find out how to achieve it in a simple and easy way.
Arengu enables you to create a payment form in minutes. You can choose to start one form of your own, or choose one of the predefined templates.
As you'll see after clicking on Create a form, there is one specific template to create a payment form. Remember, even if you choose a template, you'll be able to modify every aspect of your form and add complex and customized logic to it.
Arengu allows you to add as many fields and steps as you need. In this case, we have organized the form into two different steps: one to select the payment options, and a second one to execute the payment.
With Arengu, you could also add additional steps. For instance, you could add an SMS verification action with a one-time password before executing the payment, or a registration action before proceeding to the payment.
In order to give the users several pricing options, you can select different fields. As you can see in the example below, we chose the field Choice and added names to each subscription.
For this matter, you could also select a Dropdown field, a Cards component or a Number field, in case you want your users to write the price themselves (for instance, for the donation use case).
Arengu is a platform that allows you to build personalized payment forms. To do so, you'll have to configure the payment field that is linked to your Stripe account.
Click on the Choice field, and then go to Advanced > Internal values. For this example, we have created a subscription payment, so you will have to set the subscription ID that you will find in your Stripe account. Simply copy and paste here the ID of each pricing option in Stripe, on the proper field.
In case you have set a one-off payment, you can just write down the value of each option, without having to refer to a Stripe ID.
And last, you just have to complete the payment fields with the Stripe keys so the payments can be executed. Click on the payment field and configure it to your needs. Here, you can select the type of payment (charge or subscription), the type of currency, and other additional field settings.
In the field Amount, write the reference of the field where the price is selected. For instance, in the example below, the amount corresponds to whatever the user wrote down in the field called donation. Hence, the reference to be written in Amount is {{fields.donation}}.
To know the reference of a field, just click on it and check its ID. Remember, if the ID of the field changes, you'll have to change it here too!
Then, add your Stripe keys: Publishable key and Secret key. To get them, go to your Stripe account. Go to Developers > API keys and copy them to later paste them in Arengu.
In Fields settings, you can also set a minimum value and a maximum value to limit the quantity in the field.
To start using your payment form, you just have to embed it wherever you need in your webpage. Simply copy paste our two lines of code, including the form ID, and you'll be able to start using the dynamic payment form.
Embedding your forms is a great way to save time on form maintenance. This way, whenever you'll need to apply changes to your forms, you can do it in a centralized way, and all your pages and channels will display the modifications without deployments or any manual work.
Forms are a crucial element to improve your conversion rates, and that is why personalizing their logic to the fullest is key for any business. To learn more on how to improve conversions on your payment forms, keep an eye on Arengu's blog.
Arengu allows you to build all your user flows connected to your current stack, and avoids coding all the UI, complex integrations, validations or logic from scratch. Try it for free and start building faster and scaling your application needs as they grow.