linkedin
  1. Home
  2. /
  3. Docs
  4. /
  5. Topics
  6. /
  7. Payments
  8. /
  9. Square Payment Integratio...

Square Payment Integration

 

FooSales integrates with Square hardware to capture card payments directly within the FooSales apps for a seamless checkout experience. There is no need to synchronize product catalogs between your WooCommerce store and your Square account. Order totals are sent to Square at checkout and after the payment completes successfully, FooSales automatically completes the WooCommerce order.

Note: The FooSales Square Payments add-on is required for the Square integration which is available as an optional extra when purchasing a Single or Multiple Domain plan and it’s also available separately if you would like to add it to an existing plan.

Requirements #

The following are required for the Square payment integration:

Setup #

If you plan on integrating FooSales with a Square Stand, Reader for magstripe or Reader for contactless and chip, please ensure that you have the Square Point of Sale & Payment app installed on the iPad or Android tablet that you will be using for FooSales.

Once you have downloaded and installed the Square Point of Sale & Payment app on your tablet, log in to the app using your Square account’s username and password.

In order for FooSales and the Square Point of Sale app to be able to communicate with each other, you will need to create a new or update an existing Square application in your Square Developer Dashboard.

Create New Square Application #

Open your Square Developer Dashboard and choose New Application, Create Your First Application if it is a new account OR Open a previously created application if one already exists in your account.

Square Developer Dashboard Create Application

When creating a new application, you will need to enter a name for your application and agree to the Square Developer terms of service.

Next, open your newly created application or existing application. If you created a new application, it will automatically be set to use the latest version of the Square production API. If you are using an existing application, it is recommended that it be set to use the latest version of the Square production API for security and functionality purposes. You can make sure that your application’s production API version is set to the latest version by scrolling to the bottom of the Credentials page.

Square Api Version 2022 06 27

If you are using an existing application, already have an integration setup using an older version of the Square production API, and you are worried about breaking your current implementation by changing the API version, then to be safe, we suggest you rather create a new application for your FooSales integration.

By clicking on the Production tab, you will see your unique Application ID and Access Token. You will need to enter these two keys in your FooSales WordPress plugin settings.

Square Application Production Credentials

Next, select the Point of Sale API menu option and ensure that you still have the Production tab selected.

Square Sandbox #

FooSales makes use of the Square Point of Sale API in order to send payment requests to your Square account.

Please note: The Point of Sale API is not currently supported by the Square Sandbox environment. You can view the current status by selecting the Sandbox tab on the Point of Sale API page.

Square Sandbox Not Supported

iOS Integration #

To setup the integration with the FooSales iPad app, scroll down to the iOS section on the Point of Sale API page and enter the following in the iOS App Bundle IDs input:

com.foosales.FooSales

Then enter the following in the iOS App URL Schemes input:

foosales

Square Application Production Ios

Android Integration #

To setup the integration with the FooSales Android tablet app, scroll down to the Android section on the Point of Sale API page, click on Add New Android Package and enter the following  in the Package Name input:

com.foosales.FooSales

Then enter the following in the Fingerprint input:

A5:54:9F:97:61:4E:D0:FE:7F:AD:12:53:3D:A9:31:D2:2A:E7:53:E6

Foosales Square Android Fingerprint

Square Terminal Integration #

If you plan on integrating FooSales with a Square Terminal, you will need to add the FooSales webhook to your Square application. From the Production tab, click on the “Webhooks” menu item to expand its submenu. Select the “Subscriptions” submenu item to view the Webhook subscriptions section.

Square Webhooks Empty 2022 06 27

Click on the “Add subscription” button and enter a name for the webhook such as “FooSales Terminal API“. Enter the webhook URL for your website e.g.:

[YOUR SITE]/wp-json/foosales/v4/webhook_square

Square Webhook Name Url 2022 06 27

Next, you will need to let Square know which events it needs to send to FooSales by checking each relevant event.

FooSales needs to be notified about the following events:

  • device.code.paired
  • terminal.checkout.updated
  • terminal.refund.updated

Once you click the “Save” button, you will see your newly added webhook subscription.

Square Webhooks Added 2022 06 27

FooSales WordPress Plugin Settings #

After copying your production Application ID and Access Token, navigate to your WordPress admin area and open the FooSales plugin settings. Under Square Integration, paste your Application ID and Access Token, then save your settings and you’re good to go!

Square Integration Foosales Plugin Settings

Pairing Square Terminal #

In order to process a payment at checkout using a Square Terminal, you will need to pair a Terminal device with FooSales.

Please note that this is not necessary when using FooSales with a Square Stand, Reader for magstripe or Reader for contactless and chip, as FooSales will simply send a payment request to the Square Point of Sale & Payment app installed on the same tablet when using these devices.

In order to pair a Terminal device with FooSales, open the FooSales Settings screen and scroll down to Square Settings. Here you can select which Square location should be associated with the device that the FooSales app is running on. For instructions on how to setup more than one Square location, please read the Manage Multiple Locations with Square help documentation.

Fs Settings Square Location

Next, you will first need to sign into the Terminal using a device code that will be generated in FooSales. Click on the “Generate Code” button to generate a new device code. Once the code has been generated, you will only have 5 minutes to sign into the Terminal before the device code expires, in which case, you will need to generate a new code and re-attempt the pairing process.

Fs Settings Square Device Code

Once you enter the device code and the Terminal has loaded, the Square Settings in the FooSales app will update to show that it has paired with the device successfully.

Fs Settings Square Device Paired

After successfully pairing a device, FooSales will remember the unique device identifier when capturing payments until the device is specifically unpaired. This means that you can pair the same device to multiple FooSales apps by following the instructions above.

In order to enter a new device code on the Square Terminal which was generated by a different FooSales app, you must sign-out of the paired device while leaving the FooSales app in its paired state. To sign-out of the paired Square Terminal, swipe on the device from the far left side of the screen to display the slide-out menu, tap Settings and then tap the Sign Out button which will return the device to the login screen. You can then choose to sign-in again using the new device code.

Unpairing Square Terminal #

If FooSales is paired with a specific Square Terminal and you would like to pair it with a different device or change the Square location that FooSales is associating with the paired device, you will first need to tap the Unpair button to unpair the device in order to choose a different location and generate a new device code. To sign-out of the paired Square Terminal, swipe on the device from the far left side of the screen to show the slide-out menu, tap Settings and then tap the Sign Out button which will return the device to the login screen. You can then sign-in again using a newly generated device code.

Processing Payments at Checkout Using Square Terminal #

When you’re ready to complete an order on the Checkout screen in FooSales using a paired Square Terminal, select Square Terminal Payment as the payment method.

Screenshot Of Foosales Checkout Using The Square Terminal Card Reader Payment Method

When you click the Pay button, a checkout request will be sent to your paired Square Terminal. Follow the prompts on the Square Terminal in order to process the payment. The FooSales app will wait until the checkout is successfully completed.

Square Terminal Checkout Wait

Once the payment has been successfully completed, FooSales will submit the order to your WooCommerce database.

Processing Payments at Checkout Using Square Reader #

When you’re ready to complete an order on the Checkout screen in the FooSales app using a Square Reader, select Square Reader Payment as the payment method. The FooSales web app only supports manual credit card entries and Square Terminal payments at present so you would need to select Square Manual Payment or Square Terminal Payment as the payment method.

Square Reader Payment Method

Tapping the Pay button will open a Square payment screen which includes the order total from the checkout screen. You can now process the card payment using your Square hardware as you normally would or manually enter the card details in the case of the web app.

Square Integration Process Card

Once the payment is successfully completed, you will be returned to the FooSales app and the order will get submitted and marked as Completed in your WooCommerce store. The Square transaction will be linked to your WooCommerce order. If you open the completed order on the Orders screen, you will see the payment method highlighted if Square was used to process the payment. Tapping on this text will open the linked Square transaction in a browser window for your convenience.

If you navigate to the WooCommerce Order in your WordPress admin area, you will see the payment method marked as Square along with a link to View the transaction in a new browser tab.

Square Integration Woocommerce Order

Manual Card Processing at Checkout #

If you do not have a Square Reader device or in an emergency, you can still enter the customer’s card details manually at checkout in order to process an order payment. Select Square Manual Payment as the payment method.

When you click the Pay button, a form will appear that allows you to enter the card number, expiry date and CVC in order to process the payment. Once the payment has been successfully submitted, FooSales will complete the order and submit it to your WooCommerce store.

Square Manual Card Form

Refunding an Order #

If you entered your Square Access Token in your FooSales WordPress plugin settings and you refund an order in FooSales, the Square transaction will be automatically refunded to the card that originally made the payment. If the transaction contained split tenders or the refund failed for some unknown reason, the order status is changed to Refunded in WooCommerce and an error message is displayed that allows you to view the transaction and refund the payment manually through your Square account.

Please note: Refunding an order that was originally placed online (ie. not through FooSales) or manually through the WooCommerce back-end will not automatically refund the Square payment. If you would like to refund an order from your WordPress admin area instead of FooSales or if you would like to refund an order in FooSales that was originally placed online, you will need to click on the View transaction link in the order view to open and manually refund the payment through your Square Dashboard and then set the WooCommerce order status to Refunded.

If you originally processed the payment on a paired Square Terminal and the original card needs to be presented such as with an Interac debit card, a refund request will be sent to the paired Square Terminal and the FooSales app will wait until the refund is successfully completed.

Square Terminal Refund

If you originally processed the payment using a Square Reader in the iOS or Android app and the original card needs to be presented such as with an Interac debit card, the refund will need to be done directly in the Square Point of Sale app on the tablet, not within the FooSales app.

Tags , , , , , , , , , , , , , , , , , , , , , ,