Integrate Square (Inline Payment Integration)

Square is a powerful payment processing platform that offers Fluent Forms inline payment options and a smooth and secure payment experience using credit and debit cards.

This article will guide you through integrating Square into your WordPress Site with the Fluent Forms plugin.

NOTE

Square requires Fluent Forms Pro. See Upgrade to Fluent Forms Pro Add-on.

Enable Square Payment Method

Go to Global Settings from the Fluent Forms navbar, open the Payment tab, and select Payment Methods.

Select Square, then click Enable Square Payment Method to activate Square globally for all forms.

Configure Square with Fluent Forms

Once you enable the Square, all the required settings will appear to configure the Square with Fluent Forms.

Before starting the configuration, select any Payment Mode between Test (for test payments) and Live (for real payments) as both options follow the same process, e.g., I choose the Test Mode.

Then, you need to obtain the Application ID, Access Key, and Location ID from your Square Account.

Get the API Credentials from Square

First, log in to your Square account from here. If you do not have an account, sign up here. Then, create an app in your Square account to get the API credentials for configuration.

To create an app, log in to the Square Dashboard, go to the Account section from the Navbar, and click the Developer Console tab.

Click the Plus Icon under the Applications tab to create a new application.

Now, add a name to your application and click the Next button.

Check the Accept Payments box and click on the Next button.

Select your desired option from the pop-up with the Find your Audience option, and click the Complete button.

After creating the application, you will find the Application ID and Access Key in the Sandbox Application ID Access Token fields under the Credentials. Copy them.

Now, go to the Locations tab from the left sidebar, and copy the Location ID.

Now, return to the Square Payment Method Settings from the Global Settings section of Fluent Forms.

Then, paste the Application ID, Access Token, and Location ID in the corresponding fields.

Finally, press the Save Settings button, and your Square account will be configured with Fluent Forms for your WordPress Site.

Integrate Square in Forms

Once you finish setting up your Square payment method, you can easily add this payment method to any of your existing Payment Forms (i.e., a form where Payment Item and Payment Method fields are added).

First, go to the Editor page of your desired form by clicking its Edit option.

Once you are on the Editor page, go to the Input Customization menu on the right side of the added Payment Method field by clicking the Pencil Icon.

Now, go to the Payment Methods, check the Square option, click the Dropdown Arrow, and you will get two options. These are:

• Method Label: Here, you can change the label based on your preference for your added payment method.

• Embedded Checkout: Check this box to activate Square as an inline payment option.

Once you complete the edit, press the Save Form button to save all the changes.

Now, to embed and display the form on a specific Page/Post, copy this Shortcode from the top right side and paste it into your desired Page/Post.

Also, to see the Preview of the form, click the Preview & Design button in the middle.

Preview of Added Payment Method

Here is the preview of the Payment Method that we just added.