Collect Payments with Fluent Forms Payment Integration

The payment processing system has experienced such dynamic shifts in recent years. Payment integrations are one of them. At first, people may have faced difficulties in adopting the process. But without any doubt, payment process integrations are one of the best ways of making online payments. People who are maintaining websites, eCommerce stores, or small businesses are using these integrations frequently. 

So, many WordPress plugins are providing this fantastic facility to their users. And Fluent Forms is one of them. Today, in this article, we will discuss how you can use Fluent Forms payment integration to collect your online payment. But you should know the importance of payment integrations before getting into the details.

Why do you need payment integrations?

Nowadays, every type of business is offering its customers to pay in multiple ways. Thus receiving credit/debit cards, mobile payments, and even PayPal are all necessary payment systems for people. 

Before the integration of the payment process, every transaction had to be entered into the accounting system manually. Which created a higher risk of human error. But now, smart business people have realized that multiple payment systems allow them to access real-time data. Payment integrations help them to run organizations more efficiently and manage cash flows effectively. Let’s see some key benefits of using payment integrations.

1. Save time: The payment processors can transfer the important information to the accounting software or ERP system automatically. In that way, people don’t need to spend their time manually inputting each transaction. It saves a lot of time and employees can focus on other tasks of the company.
2. Reduce the chances of error: Sometimes, people make mistakes while calculating the transactions or records. A single miscalculation can affect the whole organization. But payment integrations create an invoice immediately against any purchase. That eliminates the errors and ensures that the calculation is accurate.
3. Increases cash flow: Payment integrations transfer transactions into the general ledger or ERP software directly. That way, businesses can manage payroll and inventory in a better way than manual operations. Also, making more informed operating decisions is easy for people then.
4. Reduce labor costs: Integrating payment with payment processors also saves costs for allocating the business workforce. As the process is easy to manage, you don’t need any dedicated employee to make the transactions while the software is doing this automatically.

Now, let’s dive into our main topic, which is Fluent Forms payment integration.

Simple payment settings with Fluent Forms

Fluent Forms is the most advanced plugin in WordPress. It comes with a drag-and-drop form builder. Creating forms with this tool is a matter of a few minutes. You don’t need an eCommerce store to accept payments for your online business. Fluent Forms allows you to collect simple payments, for goods or services, and permit users to make payments through credit cards Stripe, PayPal, Paystack, RazorPay, and Mollie.

Let’ see how you can design your forms for collecting payment by using Fluent Forms payment integrations PayPal, and Stripe. 

First, let’s arrange the default settings of Fluent Forms for the payment integration.

Configure the form settings for Fluent Forms payment integration

Go to the global settings of Fluent Forms from your dashboard. Select Payment Settings from the left sidebar. Enable Payment Module of the “Status” button.

Now set the Business Name and Business Address. Upload your business logo by clicking on the arrow button.  

Next, scroll down to the currency settings. You can use the dropdown menu to set your Default Currency.

Select “Currency Sign Position” from the radio buttons. Again choose from the dropdown menu of Currency Separators. You can hide the decimal points by clicking on the “Hide decimal points for rounded numbers” button. That’s all, your settings are done, and don’t forget to click on the “Save Settings” button. 

You can integrate Stripe and PayPal with Fluent Forms for collecting your payment. First, let’s see how Stripe works. 

Fluent Forms payment integration with Stripe

If you don’t have a Stripe account, you need to create one now. Because for Fluent Forms payment integration, you will need an API key from the Stripe account. Additionally, Stripe is a pro feature of Fluent Forms. So, if you have the pro version of the plugin, you will be able to use this. 

Now go to the global settings from your Fluent Forms dashboard.

Select “Payment Settings” from the left sidebar. Here, Click on Enable Payment Mode from the Status bar. 

Now, go to Stripe Settings. Look over if the “Enable Stripe Payment Method” is on from the Status bar. If not, enable it.

When you enable the Stripe Payment Method, you will be asked to choose from two payment methods. They are the Test mode and the Live mode. For demonstration purposes, let’s discuss the Test mode. 

Now, first, you need to provide your API keys from the Stripe account. Go to your Stripe account, and from the home button, look for the “Get your test API keys” option.

When you click on the given button, a set of keys will open. These are the “Publishable key” and the “Secret key.”

Go back to the Fluent Forms dashboard and paste the keys in their specific fields. 

Now, when you are done with the Test API keys, it will ask for Live API keys. Don’t worry, the procedure is the same. Again, head back to the Stripe account, and copy the Live API keys from there. Finally, paste it on the Fluent Forms’ respective fields, and click on the Save Stripe Settings.

Now, go back to the Fluent Forms dashboard and create your form. After adding the necessary fields, add the Payment field from the input fields option.

Customize your field from the input customization. In this case, set your Element Label, Label Placement, and Product display type. In the Payment settings, set your product types and their prices.

Next, add the “Payment Method Field” and customize it.  

Select your Payment Methods. In this case, we have set the Element Label as “Pay with card,” and Stripe will come default because we have already done the settings before.

Don’t forget to save the form, and preview it before launching.

And it’s done! Isn’t it so easy and fun to create? I would like to notify you one more thing, if you haven’t configured your Stripe business account, you will see an error message on the checkout.  

Now, let’s check out the process for PayPal.

Fluent Forms payment integration with PayPal

Like the Stripe payment settings, Fluent Forms payment integration with PayPal is quite similar. You can easily manage PayPal to your Fluent Forms dashboard. You will need a pro version of Fluent Forms to use the payment integration. 

Go to the global settings, select payment settings, same as before. Click on Enable Payment Module. This will unlock the payment status.

Next, move on to the PayPal settings, and click on the Enable Payment Module again. This will activate the PayPal Payment Method.

Now, you have to choose the PayPal Payment Mode from the given two options. One is the Sandbox Mode, and the other is Live Mode. Let’s set up the “Sandbox Mode,” please note that settings for the Live Mode can also be done in the same way.  

First, you have to give a PayPal email. More clearly, this is the email that you have used to register for a PayPal account. Place it on the specific field.

We have disabled the PayPal IPN verification. Because at this moment, we don’t need to enable this section. If you want to know more about this matter, you can visit https://developer.paypal.com/docs/api-basics/notifications/ipn/IPNSetup/#.  

When all the settings are done, click on the Save PayPal Settings. 

Now, Paypal is integrated with your Fluent Forms dashboard. 

Go back to the dashboard, create a form, name it, and add necessary fields. Now, add Payment Field from the input field of the form editor. Select your Element Label, Label Placement, Product Display Type, Payment Settings, etc. from the input customization. Same as I have selected on the Stripe integration. 

Here for the demonstration, I have included only one item.  

Now, add the “Payment Method Field” and customize it. Select PayPal from the Payment Methods.  

Save the form, and preview it before publishing.

One more thing, if you want you can use the Global Styler of Fluent Forms to make your forms more attractive. Read this article which is about styling beautiful CSS forms to know more about Custom Styler.

You can do many more settings with the Payment input fields of Fluent Forms. Let’s have a look at those too. 

Add Custom Payment Amount field on Fluent Forms payment integration

You can use the Custom Payment Amount field for deciding the maximum or minimum products users can order at a single checkout. Users can also find it useful to put the amount that they want. It’s not necessary, but you can use it when needed. Don’t worry about the total payment. It will calculate the amount accordingly.

Show the total amount

Use the shortcode {payment_total} to show the total payable amount. For instance, if you add the shortcode on the submit button text, it will show the total amount inside the button. 

Now preview it to see if it is working correctly.

Show your payment summary

Showing payment summary is very helpful in terms of designing multi-step forms. However, with Fluent Forms, you can use the section for single forms too. The plugin allows you to show the payment summary as a dynamic cart.

Select the HTML field from the input fields. When you click on the input customization field, it will look like the screenshot below.

Here, you can see three types of shortcodes on the bottom of the customization page. Choose the {dynamic.payment_summary}, copy it, and paste it in the description area.

Save it, and preview it. Fill up the form to test if it’s working right. 

Finally, save your form, copy the shortcode from the dashboard, and paste it to a page or post where you want it to be. 

We hope, now, you understand the whole process. We have tried to provide you the details as simply as we can. If you’re confused at any point, feel free to share your experience in the comment section. Furthermore, you can learn more on our documentation.

In the end

In this article, we have discussed the whole process of Fluent Forms payment integration. We also wrote about collecting payments with WordPress payment integrations. And if you are interested in learning about the best WordPress payment plugins, we have created that one too.

We would like to remind you that Fluent Forms is one of the robust plugins in the WordPress community. If you’re looking for a lite version, please check the free version on the WordPress directory. You can check out its updates and features from WordPress. The tool is updated every two or three months. So, why not try it? Give it a shot and tell us how you like it in the comments!