Affirm-developers

Lightspeed Ecommerce

Integrate Affirm into the Lightspeed e-commerce platform.

Overview

This guide describes how to integrate Affirm into your Lightspeed e-commerce platform so that you can provide Affirm as a payment option to your customers. After integrating Affirm, your Lightspeed Ecom site will:

  • Offer Affirm as a payment option on the checkout page
  • Process Affirm charges in your order management system
  • Display Affirm promotional messaging

Before you begin 

Before beginning integration, you should review:

Sandbox development

You should have received an email inviting you to create an Affirm account. Click here for information about accessing your account.

Develop and test the Affirm integration in your development environment connected to our sandbox. To use our sandbox, retrieve your sandbox API keys at https://sandbox.affirm.com/dashboard/#/apikeys for use during integration.

After development and testing, you'll need to update your integration to use your live API keys, which you can find at https://affirm.com/dashboard/#/apikeys.

1. Install Affirm

1. Find the app in the Lightspeed App Store here.
2. Click Install.
3. Log into Lightspeed and select your store.
4. Click Install App within Lightspeed Ecom.
5. Enter the credentials you use to log in to store.shoplightspeed.com and click Next.

6. Follow the remaining steps. During the install, you'll be forwarded to our app management site to either login to an existing account (if you've purchased a Lightspeed eCom app from AdVision before) OR create a new account with AdVision to install and manage this and any future apps you may purchase.

Once you've created an account or logged into your existing account, the app installs automatically, after which you'll be forwarded to the shops list, which displays a list of Lightspeed eCom shops registered with your account and any apps installed with those shops.  

To finish the installation of this app, click on "Affirm" under the appropriate shop.  This will take you to the settings for the app.

2. Configure Affirm as a payment method and add Affirm promotional messaging

The AdVision settings help generate the Affirm promotional marketing on both the product and car pages.

Settings

Within settings, you can control:
General Settings

  1. Enable Affirm - determines if Affirm should show in your checkout as a payment option. Check this box and save changes to show, uncheck box and save changes to hide.

  2. Mode - if you want to perform test transactions with Affirm, set mode to Test. If you want to take real payments, set mode to Live.

API Settings

FieldDescription
Live Public API KeyThe production public API key found in your Affirm dashboard.
Live Private API KeyThe production private API key found in your Affirm dashboard.
Test Public API KeyThe sandbox public API key found in your Sandbox Affirm dashboard.
Test Private API KeyThe sandbox private API key found in your Sandbox Affirm dashboard.
Merchant NameYour business name.
Payment ActionAuthorize Only: Authorize the payment when the customer places their order.

Authorize and Capture: Immediately captures the payment after authorization.

Site Settings

FieldDescription
Include Affirm Enhanced AnalyticsAdds Affirm's enhanced analytics code to be included on the final page (order receipt display) of your checkout. The app will include tracking code on your website.
Minimum Order ThresholdThis is the minimum order amount required for Affirm to be displayed as a checkout option. This number must be higher than $50. If blank, the default value of $50 will be used. If a customer's order total is less than this minimum, Affirm will not be shown as a payment option in your store's checkout.
Maximum Order ThresholdSet the maximum order total needed to make payment via Affirm. If a customer's order total is more than this maximum, Affirm will not be shown as a payment option in your store's checkout.

Product and Cart Promotional Messaging

FieldDescription
Enable Promotional Messaging on (Product or Cart) PageDetermine whether to enable the Affirm promotional messaging.
ColorDetermine the color to use for the logo or symbol on your Affirm promotional messaging
TypeDetermine the type of display to use for the Affirm promotional messaging.

Logo: Shows the full Affirm logo
Text: Shows text only
Symbol: Uses a smaller/partial Affirm logo.
Target ElementDetermine which element that already exists on your page and that you'd like to use to determine where the promotional messaging should load.

This is determined by targeting an existing element, for example, on the product's page you might want to target the product's existing price display to show the promotional messaging next to it. The value expected here is either a class, ID or another valid jQuery selector.

NOTE: If you're unfamiliar with CSS, Javascript, or jQuery, we recommend you contract someone familiar with web development. What is needed is a way to tell this app which element you want to target, so the app will show the relevant Affirm messaging next to that element. Please email [email protected] if you need any assistance!
Target ActionThis tells the app where, in relation to the target element you've specified in the previous field, the promotional messaging should be inserted. You can either Insert After, Insert Before, Prepend Within, or Append Within, the existing element you're targeting.

Payment Page

FieldDescription
Do NOT Auto Generate OrderDon't show instructions with Create Affirm Order button on page, just attempt to automatically start the Affirm payment process. Only select this if you are using the AdVision Gift Card payment app.

Loading Page Settings (optional)

FieldDescription
Logo URLProvide full (absolute) URL (web address) to the logo you'd like to display on any of this app's loading page.
Background ColorSelect the background color you'd like for any of this app's loading page.
Text ColorSelect the text color you'd like to use for any text displayed on this app's loading page.
Custom CSSOnly for users with advanced experience working in CSS code. Any CSS provided here will load on any of the app's loading page.

Improper use of this field may cause the app to not function correctly.
Custom JavascriptOnly for users with advanced experience working in Javascript. Any Javascript provided here will load on any of the app's loading page.

Improper use of this field may cause the app to not function correctly.

📘

If you make any changes to any of these settings fields, be sure to click "Save Settings" button to save those changes. After you have saved your changes, be sure to scroll to the bottom of the page and click Check Install (Publish Changes), to ensure any changes you've made that require publishing, are published to the eCom website. It can take several minutes for Lightspeed to publish changes.

3. Coordinate testing with Affirm

Before deploying the Affirm integration to your production site, Affirm will need to test it in your development or staging environment connected to our live environment. Contact your Integration Consultant or [email protected] to coordinate this test.

4. Deploy to production

Connect to the live Affirm environment

After coordinating a successful test with Affirm’s Merchant help team, connect to the live Affirm environment:

1. Retrieve your live API keys at https://affirm.com/dashboard/#/apikeys.
2. Sign in to your AdVision Ecommerce app settings.
3. Go to Settings and scroll down to API Settings.
4. Enter the Live Public API Key (Affirm public key) and Live Private API Key (Affirm private key) you retrieved from the live merchant dashboard.
5. Change Mode from Test to Live.
6. Scroll down and click Save Settings and then Check Install (Publish Changes).

Launch to production

After you've connected to our live environment and we've tested your integration, you're ready to deploy to your production environment and offer Affirm as a payment option to your customers.

Updated about a month ago


Lightspeed Ecommerce


Integrate Affirm into the Lightspeed e-commerce platform.

Suggested Edits are limited on API Reference Pages

You can only suggest edits to Markdown body content, but not to the API spec.