Square Payments
Disclaimers:
CheckoutChamp does not store any card details for merchants using Square's Payment Gateway
Square will work for One-time and recurring purchases
Square will ONLY work with landers that connect to Konnektive via Direct API. This will NOT work with Form-code landers, Order Entry, or FunnelKonnekt.
How to Obtain Square Credentials
Step 1. Go here and login to the Square Developer Dashboard using your Square credentials
Step 2. Once logged into the Developer Dashboard click New Application
Step 3. Name and Create your Application, Doing so gives you complete API access for your Square merchant account.
Step 4 Once you have created your Application, Navigate to the Credentials Section.
Step 4a: Make sure to turn Sandbox Mode OFF.
Step 5. Once you have turned off Sandbox Mode you will be able to access your Application Id
Step 6. Navigate to the Locations Section to uncover your LocationId
Navigate to the OAuth Section to obtain your ApplicationSecret and to set your Redirect URL which is https://api.konnektive.com/oauth/square/
Note: If you have any issues with these credentials attempt to use legacy credentials and re-attempt your test.
How to set up Square
Step 1. Go to Gateways > Gateway Integrations
Step 2. Scroll down until you see Square
Step 3. Click the green Activate button to activate Square
Step 4. Enter your AccessToken and LocationId in the General Details Section of the Create Gateway screen.
Step 5. Click the green Create Gateway button to save your changes and create the gateway.
Once the ApplicationId, Application Secret, and LocationId are set, please hit the below link to authorize the CRM to access your Square account.
Prerequisites
Checkout page should be secure HTTPS. A non-secured call to the Square gateway will be rejected.
"Application Id", which you will get from your Square gateway account.
Reference: https://developer.squareup.com/docs/get-started
You can download the javascript/css files for the SQPaymentForm here
Once you have obtained the javascript/css files, place them in the same directory as your landing page code on your web server.
Checkout Page Changes
Step 1: Add 3 hidden input fields in the checkout form. Square gateway reference:
<input type='hidden' name='prepaidType' value='SQUARE'>
Square gateway credit card reference:
<input type='hidden' name='formCardNonce'id='formCardNonce' value=''>
It is important to note that you will need to pass the paysource=PREPAID and prepaidType=SQUARE when forming the Import Order call to Konnektive.
Square gateway credit card postal code reference:
<input type='hidden'name='formCardNoncePostalCode'id='formCardNoncePostalCode' value=''>
formCardNonce & formCardNoncePostalCode fields will be populated on successful submission of Square SQPaymentForm.
Step 2: Add the below script on your checkout page to open the SQPaymentForm.
Note: Billing postal code is mandatory.
Square SQPaymentForm JS Changes
Replace the square application id in "applicationId" const in the JS file.
Alternative Implementation
If you would like to have Square's SQPaymentForm embedded onto your checkout page, you will have to follow Sqaure's documentation, found here and make the required changes to your lander to support this.
Upsells with Square
Add these hidden inputs to your upsell page code.
<input type='hidden' name='prepaidType' value='SQUARE'> <input type='hidden' name='formCardNonce' id='formCardNonce' value=''>
Last updated