Initializing Smile UI

JavaScript

// If the script is loaded synchronously
SmileUI.initialize({
  publishableKey: "pub_0987654321",
  customerToken:
    "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJhdWQiOiJhcGkuc21pbGUuaW8iLCJzdWIiOiJTaG9waWZ5Q3VzdG9tZXI6MTA3MzM0NTgiLCJleHAiOjE1ODU1OTE1MzZ9.3SOqHMbmqvfuzHLrABbFNzwlgkFJnj8xtubttfmM4-o",
});

// If the script is loaded asynchronously
document.addEventListener("smile-ui-loaded", () => {
  SmileUI.initialize({
    publishableKey: "pub_0987654321",
    customerToken:
      "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJhdWQiOiJhcGkuc21pbGUuaW8iLCJzdWIiOiJTaG9waWZ5Q3VzdG9tZXI6MTA3MzM0NTgiLCJleHAiOjE1ODU1OTE1MzZ9.3SOqHMbmqvfuzHLrABbFNzwlgkFJnj8xtubttfmM4-o",
  });
});

JavaScript

// If the script is loaded synchronously
SmileUI.initialize({
  publishableKey: "pub_0987654321",
  customerToken:
    "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJhdWQiOiJhcGkuc21pbGUuaW8iLCJzdWIiOiJTaG9waWZ5Q3VzdG9tZXI6MTA3MzM0NTgiLCJleHAiOjE1ODU1OTE1MzZ9.3SOqHMbmqvfuzHLrABbFNzwlgkFJnj8xtubttfmM4-o",
});

// If the script is loaded asynchronously
document.addEventListener("smile-ui-loaded", () => {
  SmileUI.initialize({
    publishableKey: "pub_0987654321",
    customerToken:
      "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJhdWQiOiJhcGkuc21pbGUuaW8iLCJzdWIiOiJTaG9waWZ5Q3VzdG9tZXI6MTA3MzM0NTgiLCJleHAiOjE1ODU1OTE1MzZ9.3SOqHMbmqvfuzHLrABbFNzwlgkFJnj8xtubttfmM4-o",
  });
});

This method initializes Smile UI with information about the loyalty program to display and the currently logged in customer. This method must be called before you can interact with any other methods.

If you’re loading the Smile UI script asynchronously, you should wrap your initialization code within a loaded event to ensure it doesn’t encounter an error due to the script not yet being present on the page.

Parameters

object

required

Show properties

string

required

Your Smile.io publishable key. This is used for identifying your store and can be made public. Refer to the help docs for where to find it.

string

A customer token identifying the currently logged-in customer. This should be null or omitted entirely if no customer is currently logged-in.

boolean

default:"false"

Whether to load and initialize Smile’s JavaScript SDK (Smile.js) alongside Smile UI. This is useful when you also want the JavaScript SDK’s methods and objects available on the page.

Returns

This method does not return a value. To detect when initialization is complete, use SmileUI.ready().

⌘I

Panel actions

Panel events

Deprecated

Parameters

Returns

​Parameters

​Returns

Parameters

Returns