Shopify extension Splio: Marketing Automation


Prerequisites

  • The Splio app must be installed from the Shopify App Store before any configuration
  • Have your Splio configuration details ready: universe ID, Configuration ID and API key (from the Splio platform)

Step 1 — Create the metafield definition

The SDK reads its configuration from a JSON metafield attached to the Shopify page. First, create the metafield definition.

  1. Go to Shopify Admin > Settings > Custom data > Pages > Metafields https://admin.shopify.com/store/{store}/settings/custom_data/page/metafields
  2. Create a new metafield with the following settings:
    • Name: splioSDK.configurationsMap
    • Type: JSON

Step 2 — Create the page

  1. Go to Shopify Admin > Online Store > Pages
  2. Create a new page (e.g. "Loyalty")
  3. Note the page slug (e.g. /pages/loyalty) — it will be used for the return_to parameter

Step 3 — Set the metafield value on the page

  1. Open the page created in step 2 in Shopify Admin > Online Store > Pages
  2. Scroll down to the Metafields section
  3. Fill in the splioSDK.configurationsMap field with the following JSON payload:
{
  "fr": {
    "id": "your_configuration_id_fr",
    "apiKey": "your_api_key_fr"
  },
  "en": {
    "id": "your_configuration_id_en",
    "apiKey": "your_api_key_en"
  }
}

The top-level key corresponds to the locale ISO code (fr, en, etc.). If the visitor's locale is not found, the SDK uses the first entry as a fallback.


Step 4 — Add the block in the theme editor

  1. Go to Online Store > Themes > Customize
  2. Navigate to the page created in step 2
  3. Add the Splio Loyalty Web Kit block to a section
  1. Configure the block settings (see step 5)

Step 5 — Configure the block

Required settings

SettingDescription
Splio UniverseYour Splio universe ID
Display modeinline, popup or widget

External ID source

Defines which Shopify customer data is used as the unique identifier in Splio.

OptionDescription
EmailCustomer email (default)
PhonePhone number
Shopify Customer IDShopify internal customer ID
Customer metafieldValue from a custom customer metafield

Using a customer metafield as external ID

If the Splio identifier is stored in a customer metafield:

  1. Go to Shopify Admin > Settings > Custom data > Customers > Metafields
  2. Create or identify the metafield containing the ID (e.g. splio_id, shp_id...)
  3. In the block, select External ID sourceCustomer metafield
  4. Fill in the Metafield key field using the namespace.key format
    • Example: custom.splio_id

If the metafield is not set on the customer, the SDK falls back to the email.

Optional settings

SettingDescription
Card codeRequired only if your loyalty program does not auto-generate card codes
List IDsComma-separated list IDs for opt-in on contact creation. Example: 3,4,16. Cannot be updated after creation.
Hide if logged outHides the block if the customer is not logged in

Step 6 — Configure redirect URLs on the Splio platform

In the SDK configuration on the Splio platform, update the signin and signup URLs.

Legacy accounts (before Shopify migration)

"unconnected": {
  "signin": "https://{store}.myshopify.com/account/register",
  "signup": "https://{store}.myshopify.com/account/login"
}

New customer accounts (after Shopify migration)

"unconnected": {
  "signin": "https://{store}.myshopify.com/customer_authentication/login?return_to=/pages/{loyalty-page}",
  "signup": "https://{store}.myshopify.com/customer_authentication/login?return_to=/pages/{loyalty-page}"
}

The return_to parameter must point to the slug of the page created in step 2. After login, Shopify redirects the customer to that page and the SDK enrolls them in the program.

With new customer accounts, /account/register no longer exists. Both login and registration go through the same /customer_authentication/login endpoint.