📘

Be sure to read our Setting up the SDK section

It contains all of the setup work required before you can instantiate the Customer Enrollment SDK Feature.

For a high-level explanation of the process for enrolling new users, go back to the Enrolling New Skipify Users page.

Overview

The enrollment checkbox allows you to know when a consumer is opting in to sign up for a Skipify account during the Expedited Guest Checkout experience. It should be used in conjunction with the enrollCustomer function once the customer has submitted their order.

See the image below for an example of where to place the checkbox on your guest checkout form:

Rendering the Checkbox

You can insert the Skipify's Enrollment Checkbox, Terms & Conditions, and Privacy notice by calling the render function. Pass in the enroll object with the id of the DOM element in which to place it, the default checkbox value, and an onChange callback function. See the following code snippet for reference:

var shouldEnroll = true; // This variable is used in the logic for the "Enroll Customer Function" section below

new window.GoCartSDK.Button({
   orderDetailsCallback: ()=> {}, // Remember to include these (empty) required callbacks
   success: ()=> {},
   error: ()=> {},
   theme: 'light', // Optional; see below for additional details
 }).render({
   enroll: {
     id: 'gocart-enroll-container',
     defaultValue: true,
     onChange: (isChecked) => { 
       shouldEnroll = isChecked 
     }
   }
});

👍

Best Practice!

Pre-check this box in order to allow your consumers to sign up for Skipify seamlessly as they pay

Checkbox Theme

The Skipify checkbox and user agreement is designed to match a light theme:

It can also be set to match a dark theme by adding the optional 'theme' parameter and setting it to dark:

enrollCustomer function

If the checkbox is selected when the customer submits their order, you will need to call the enrollCustomer function. This will launch a modal that will handle enrolling the customer in Skipify using a one-time passcode (OTP) verification.

See the code below for calling the enrollCustomer function:

const submitOrder = () => {
  if (shouldEnroll) { // This references the variable in the code snippet from "Rendering the Checkbox"
    new window.GoCartSDK.enrollCustomer(customerInfo); // see subsections below for more details
  }
  // Insert your checkout logic here
}

// @returns response from the API for account verification

Skipify will use the customerInfo that you pass into the enrollCustomer function to enroll a customer. The fields for customerInfo are listed below:

{
  "firstName": "string", // Optional
  "lastName": "string", // Optional
  "phoneNumber": "string",
  "emailAddress": "string",
  "paymentMethods": [ // Can be empty array
    {
      "nickName": "string", // Optional
      "fullnameCard": "string",
      "cardNumber": "string",
      "expMonth": 0,
      "expYear": 0
    }
  ],
  "addresses": [ // Can be empty array
    {
      "firstName": "string",
      "lastName": "string",
      "company": "string", // Optional
      "address1": "string",
      "address2": "string", // Optional
      "city": "string",
      "state": "string",
      "country": "string",
      "zip": "string",
      "phoneNumber": "string" // Optional
    }
  ]
}