Adding loyalty points via Shopify

In this tutorial, let's set up Shopify so that customers can earn loyalty points for completing their order and see their current loyalty balance in Shopify.

Talon.One requirements

• You are an admin user.
• You have set up an Application and a campaign.
• You have set up a profile-based loyalty program.

Shopify requirements

• You are an administrator user.
• You have completed the basic setup of the Talon.One Shopify app.

Setting up the integration

1

Create a rule in Talon.One

The Talon.One Shopify app automatically closes the customer's session in Talon.One after they complete their order.

So let's create a rule in your Talon.One campaign that awards 100 loyalty points whenever a customer session is closed:

What	Name	Properties
Conditions	Check for event types and custom event values	Event type: Customer Session Closing
Effects	Add loyalty points	Loyalty program: Select the loyalty program you created. Recipient: Current Customer (Friend) Reason: Order bonus Amount of points: 100

2

Display the loyalty balance in Shopify

Now that our loyalty program is working, we want to display the customer's loyalty balance in Shopify.

Theme-based stores

For theme-based stores, the app embed automatically fetches customer data from Talon.One and stores it in a customer metafield.

To retrieve the loyalty information from that metafield and display it in your online store:

1. In Shopify, open Online Store > Themes.

2. Find the theme that you want to edit and click Customize.

3. Open the store page that you want to customize.

4. In the sidebar, click Add section and choose Custom Liquid.

5. Add the following Liquid code, where YOUR_LOYALTY_API_NAME is the API name of your loyalty program in Talon.One:

   {% if customer %}
     {% assign loyalty_data = customer.metafields.talon_one.data.value.loyalty.programs.YOUR_LOYALTY_API_NAME %}
     <p>
       <strong>Welcome, {{ customer.first_name }}!</strong>
       {% if loyalty_data %}
         You have collected {{ loyalty_data.ledger.currentBalance }} loyalty points.
       {% endif %}
     </p>
   {% endif %}

   tip

   • To see the API name, open your loyalty program and click Settings > Basic Info.
   • If you're only using a single loyalty program in your Application and want to avoid entering the API name, you can use first[1]: {% assign loyalty_data = customer.metafields.talon_one.data.value.loyalty.programs.first[1] %}

6. Click Save.

When you view your store, you'll see a new section with a welcome message and the customer's current loyalty balance.

Headless stores

To display the loyalty balance in a headless store:

1. Call the Retrieve customer data endpoint to fetch customer data. Calling the endpoint also stores the data in a customer metafield.

2. Use the loyalty object in the response or in the metafield to access the loyalty data, for example:

   {
     "loyalty": {
       "programs": {
         "My_Loyalty_Program": {
           "ledger": {
             "currentBalance": 100,
             "pendingBalance": 0,
             "totalBalance": 100,
             ... // other properties
           }
         }
       }
     }
   }

3. Modify the template of your store to display the loyalty balance.

3

Add the metafield to the Shopify admin

To verify that the integration is working, you can add the metafield to the Shopify admin user interface.

note

This step is optional. The Talon.One Shopify app always syncs the metafield data, regardless of whether it is visible in the Shopify admin.

To add the metafield:

1. In Shopify, open Settings > Metafields and metaobjects > Customers.
2. Click View unstructured metafields.
3. Next to talon_one.data, click Add definition.
4. Enter a name for the metafield, for example, Talon.One Customer Data.
5. Click Select type and select JSON.
6. Click Save.

Now, when you open a customer profile in the Shopify admin, you can see the metafield and the data stored for that customer.