ShopSocially Loyalty App allows businesses to define a set of user actions they want to reward, and the type, and quantity of rewards associated with each of these actions. Most of the user actions can be automatically tracked and rewarded by ShopSocially. This document explains how to configure Loyalty dashboard and the reward notification.


Dashboard Config


The Dashboard Config consists of the below:

  • Authentication Options 
  • Instagram Details 
  • Twitter Details 
  • Points Notification Widget 
  • Loyalty Dashboard 
  • ShopSocially Hosted Page
  • Email Configuration
  • Color Configuration (Super Admin Only)


These are explained in separate sections below.


To navigate to Dashboard Config, please follow the steps given below:


1. Login into Merchant Centre.

2. Click Loyalty tab.

3. In Loyalty tab, click Dashboard Config. Refer to Figure: Dashboard Config.


Figure: Dashboard Config


Authentication Options

For details please refer to Customer Authentication - Loyalty Program.

Instagram Details

Configure Instagram Details, if you want to reward the user to connect via Instagram. When the user logs in via Instagram, it asks for the user's permission, and once granted the user's Instagram profile is shared with merchant.

Please note:
1. You should have set up Instagram API. For details, please refer Instagram API (Under construction).
2. To activate Connect via Instagram activity, you will need to configure Instagram Details (Explained below).
3. When user connects via Instagram, only the user's Instagram profile is shared merchant. If you want the user to follow your page on Instagram, you will need to set the 'Became a Instagram Follower' (Under Development) in Loyalty, in Activities tab.
4. The points a user can earn for 'Connect via Instagram' can only be done under 'Earn Points' in the user's Loyalty Dashboard, in 'Connect via Instagram'. Please refer to Figure: Connect Via Instagram.

To configure Instagram Details, please follow the steps given below:

1. In Instagram Details, please provide:
1. Instagram Username: Your Instagram username, and click 'Get User ID' 
2. Instagram User ID: The Instagram user ID will be populated automatically when you complete step 1.
3. Instagram API KEY: This is the API key which you get when you create the Instagram API. 
4. Instagram API Secret: This is the Instagram secret which you get when you create the Instagram API. Refer to Figure: Instagram Details.
5. Click Save.


Figure: Instagram Details


How the user will see is depicted in the below Figure: Connect Via Instagram.

Figure: Connect Via Instagram


Twitter Details

Configure Twitter Details, if you want to reward the user to connect via Twitter. When the user logs in via Twitter, it asks for the user's permission, and once granted the user's Twitter profile is shared with merchant.
 
Please note
1. You should have set up Twitter App. For details, please refer Twitter App.
2. To activate Connect via Twitter activity, you will need to configure Instagram Details (Explained below).
3. When user connects via Twitter, only the user's Twitter profile is shared merchant. If you want the user to follow your Twitter handle, you will need to set the 'Became a Twitter Follower' in Loyalty, in Activities tab.
4. The points a user can earn for 'Connect via Twitter' can only be done under 'Earn Points' in the user's Loyalty Dashboard, in 'Connect via Twitter'. Please refer to Figure: Connect Via Twitter.

To configure Twitter Details, please follow the steps given below:
 

1. In Twitter Details, please provide:

1. Twitter Username: Your Twitter username, and click 'Get User ID'.
2. Twitter User ID: The Twitter user ID will be populated automatically when you complete step 1. 
3. Twitter Consumer Key: This is the API key which you get when you create the Twitter API. 
4. Twitter Consumer Secret: This is the Twitter consumer secret which you get when you create the Twitter API. Refer to Figure: Twitter Details.
5. Click Save.

Figure: Twitter Details


How the user will see is depicted in the below Figure: Connect Via Twitter.

Figure: Connect Via Twitter


Points Notification Widget

Whenever a visitor performs an activity which earns the user, loyalty points, the user will see a notification pop up. This section controls the look of that pop up. 

Please follow steps given below:


1. In Points Notification Widget, provide:

  • Notification Image (25 X 60 px)
  • Enrollment Popup Content HTML. Refer to Figure: Points Notification Widget.
2. Click Save.


Figure: Points Notification Widget


How the user will see is depicted in the below Figure: User Notification.


Figure: User Notification


Loyalty Dashboard


In Loyalty Dashboard, you will need to enter the URL of the page where you wish to host the Loyalty Dashboard. You will also need to add an HTML div tag with the ID 'ss_loyalty_div' on that page. The Loyalty Dashboard will be rendered in an iFrame on that page.

Please follow steps given below:
1. In Loyalty Dashboard, provide:
  • User Dashboard URL: Enter the URL of the page where you wish to host the Loyalty Dashboard. You will also need to add an HTML div tag with the ID 'ss_loyalty_div' on that page. The loyalty dashboard will be rendered in an iFrame on that page.
  • Display Earning Opportunities: Select this check box, if you want to display earning opportunities to user.
  • Display Tier Info: Select this check box, if you want to display Tier info to user.  
  • Show Qualified Points: Select this check box, if you want to show Qualified points to user. Refer to Figure: Loyalty Dashboard.
  • Show Redeemed Coupon Code: Select this check box, if you want to show Redeemed Coupon Code.


Figure: Loyalty Dashboard


2. Click Save.

ShopSocially Hosted Page

If the Loyalty dashboard will be hosted on your website, then you can ignore this section. But if you want to keep the Loyalty program separate from your website and host it on a ShopSocially page, then you need to set certain fields.

Please follow the steps given below:
1. In ShopSocially Hosted Page, provide:
  • Page Title 
  • Header HTML. Refer to Figure: ShopSocially Hosted Page.

Figure: ShopSocially Hosted Page


2. Click Save.

Email Configuration

You can send a welcome email to the user, when the user logs in to the Loaylty Dashboard for the first time.

Please follow steps given below:
1. In Email Configuration, provide:
  • Send Welcome Email: Select this check box, if you want to send welcome email. 
  • Welcome Email Subject 
  • Welcome Email HTML. Refer to Figure: Welcome Email.

Figure: Welcome Email

2. Click Save.

Color Configuration (Super Admin Only)

Using this feature Loyalty Dashboard color can be made configurable.

Please follow steps given below:

1. In Color Configuration (Super Admin Only), provide:

  • Brand Color* 
  • User Details Box Color* 
  • Approved Item Color* 
  • Redeemed Item Color* 
  • Pending Item Color* 
  • Rejected Item Color* 
  • Deducted Item Color*. Refer to Figure: Color Configuration 1


Figure: Color Configuration 1


Figure: Color Configuration 2 depicts how the user sees the Dashboard color combination.

Figure: Color Configuration 2


Dashboard Config variables list

Below is Dashboard Config variables list you can use:

Variable Description
_USER_NAME_
_MERCHANT_NAME_
_USER_DASHBOARD_URL_
_SUPPORT_EMAIL_
Welcome Email
_COUPON_CODE_
_USER_EMAIL_
After Redemption HTML