Shopify

Shopify plugin integration steps

1) Panel setup

The Shopify integration process is essentially divided into the following parts. We support Email ID, Mobile number and Customer ID as Primary key for all Shopify stores. However, we strongly recommend using Shopify Customer ID as the PK for seamless functioning of all features and prevention of any data loss.

• To connect to the Shopify store, go to "Assets" -> "Websites" and select "Add Website". Refer to the below image.

• On mouse hover of "Add Website", you will be able to see 3 options - Standard, Shopify or Magento.
  Click on "Shopify" to proceed further.

• You will need to provide your Website URL and Shopify store name as shown below

• Next you can click on the "Save" button followed by the "Connect" button.

• Following attributes need to be created on the panel before installation of the plugin:
  -NAME - textline - captured with Customer Register event and Product purchase event
  -FIRST_NAME - textline - captured with Customer Register event and Product purchase event
  -LAST_NAME - textline - captured with Customer Register event and Product purchase event
  -MOBILE - textline - captured with Customer Register event and Product purchase event
  -CUSTID - textline - captured with Customer Register event and Product purchase event
  -SIGNUPDATE - date (YYYY-MM-DD) - captured with customer register event
  -CITY - textline - captured with Product purchase event
  -COUNTRY - textline - captured with Product purchase event
  -STATE - textline - captured with Product purchase event
  -ZIP - textline - captured with Product purchase event
  -SOURCE - textline - This additional attribute is to be created when we are tracking data from multiple websites to the panel. This attribute can be filled with the website name for future identification.

  Note: Only these attributes should be pre-created on the panel before integration.

2) Plugin installation

• The following information will be shared by our integration team to the development team to generate a plugin installation link for your store:
  -Website
  -Store name
  -Panel name
  -Primary Key
• Using this link, you can install our plugin on your Shopify store.
  Note: Only a superuser is authorised to set up the plugin.
• After the app is set up in the client store, go back to the CEE panel and click on the "Connect" button on your website asset.

• On clicking on the 'Connect' button, a pop-up will appear to start historic data sync from your Shopify store to Netcore's CEE panel. This should be done only during the first setup.
  The following data points would be synced:
  • The first stage would start the sync process for Product Purchase Order Data - Last 60 days of data
  • Second Stage it would sync your Cart Abandonment Data - Last 60 days of data
  • The third Stage would sync your user contact information into CEE- All Contacts

• In case you want to temporarily stop the plugin usage, click on "Disconnect" besides the Shopify Store Name.

3) Data points captured through the plugin

• Historic Product Purchase and Abandon Cart data for last 60 days and all your user contacts from Shopify store.

• Following JavaScript events will be captured for all user activities done on your Shopify website :

  • Page Browse
  • Product Search
  • Product View
  • Checkout
  • Add to Cart
  • Remove from Cart

🚧

NOTE:

• JS event integration would work seamless only if you have used Shopify's standard theme to build your website. If any other custom theme is used, please make sure to check the functioning and capturing of these events thoroughly before proceeding ahead.
• If events are not coming through please refer to the following link for debugging - https://cedocs.netcorecloud.com/docs/checks-for-onboarding

• Following events would be tracked using Shopify webhooks :
  • Customer Registration
  • Cart Abandonment
  • Product Purchase
  • Checkout Started
  • Order Fulfilled

Other features

You can enable browser push notification feature by editing Shopify Store details. Fill the necessary details like fcm key, etc and then click on "Re-connect" to pass all the changes to Shopify store to activate browser push feature.

What happens once you connect your Shopify Store with CEE:

1. System would first start syncing your historical information from the Shopify platform to CEE in the following order:
   1.1 - The first stage would start the sync process for Product Purchase Order Data - Last 60 days of data
   1.2 - Second Stage it would sync your Cart Abandonment Data - Last 60 days of data
   1.3 - The third Stage would sync your user contact information into CEE- All Contacts

🚧

Note

Keep the below mentioned attributes in our panel already created, before integrating with Shopify

• NAME - textline - captured with Customer Register event and Product purchase event
• FIRST_NAME - textline - captured with Customer Register event and Product purchase event
• LAST_NAME - textline - captured with Customer Register event and Product purchase event
• MOBILE - textline - captured with Customer Register event and Product purchase event
• CUSTID - textline - captured with Customer Register event and Product purchase event
• SIGNUPDATE - date (YYYY-MM-DD) - captured with customer register event
• CITY - textline - captured with Product purchase event
• COUNTRY - textline - captured with Product purchase event
• STATE - textline - captured with Product purchase event
• ZIP - textline - captured with Product purchase event

📘

Adding Custom attributes

To know more about adding custom attributes click here

2. Second it would auto-capture out of the box events that a Shopify website provide with detailed event information.

3. It would trigger an offline Cart Abandonment Activity every time user abandons their cart. This is a functionality provided by Shopify which creates a Cart Abandonment list every time a user Adds a Product but does not purchase within a few minutes.
   Now whenever your Shopify store would do this, the same would be passed to CEE as well in the form of offline activity.

👍

New release!

Mobile no. and Customer ID can now be used as Primary Key for all Shopify websites!

2. To use Mobile no. as primary key, it needs to be added to the Registration form and customer register event.
   • Phone field needs be added in the main-register.liquid file
   • It also needs to be added in the language file - en.default.json
     

If you are capturing any additional information with the above listed Shopify events using a 3rd party plugin, please ensure they are dispatched using the standard Shopify method of Line items, if Yes, then our Plugin would auto-capture those as well.

Whenever any event is fired, along with the above event-specific parameters, the below-mentioned parameters will also be sent over to CEE.

• Browser Info
• Visit(New or returning)
• Time spent on Page
• Time spent on Site
• URL
• Previous URL
• NPV(Total Page Views)
• Webpage Title

For validation of events being sent over to CEE, head over to the Activity Dashboard(Insight > Dashboards & Reports > Activity Dashboard).

Custom Activity

In case you have other activities which you wish to track other than the predefined ones specified above, you can do the same with Auto Discovery .

Auto Discovery helps to track custom events without even requiring to configure those events over on CEE.

Follow the steps mentioned below for configuring Auto Discovery over on your Shopify Store -

1. Copy the following code snippet.

smartech('dispatch', '<activity name>', <value in JSON>);

//Example
smartech('dispatch', 'Product View', {
    'productname': 'T-shirt',
    'size': 'M,
    'price': 999.10
});

2. Once code copied and configured according to the activity you wish to track(Refer to the Example stated above), head over to your 'myshopify store' and then click on Online Store under 'Sales Channel'.

3. Once on the page(As shown in the image above), click on 'Actions' on the right hand side and then select 'Edit Code'.

4. Once on the 'Edit Code' page, you will be able to see folders with the name of Layouts, Templates, Sections, etc. (If not able to see 7 folders at one go, then minimize the expanded folders).
   Click on Snippets Folder.

5. Click on 'Snippets' folder and click on Add a new snippet(You can give any name to the snippet). Once the new snippet is added(As can be seen no the above image with 'smartech.liquid' name), paste the copied code(refer to point 1) over to the newly added snippet.
   Note - Do add

6. Now head over to the Layout folder and click on theme.liquid. Over there add the following text - {% include 'smartech' %}(Smartech is just for reference. Put the name you gave to the newly added snippet). Add the text to the ninth line of the code.
   Once done click on save to enable tracking of the custom activity.

Guest Checkout

1. User Identification after Complete Guest Checkout process

• For Shopify Websites, customers can do checkout even if he/she is not logged in. This we consider as 'Guest Checkout.'
• For Guest checkout the user needs to enter his/her Email Id/Mobile Number and shipping details in order to do checkout as a Guest.
• In the above scenario, CEE identifies the user with the help of their entered email id, thus turning the user into an identified user from an anonymomus one.

2. User Identification via API on Checkout Form completion

• Guest users can now be identified even before the checkout step.
• Whenever a guest user fills the user details form before the checkout step, an API is called which communicates the user's primary key i.e. their email ID to the CEE panel.
• Hence, classifying the user as an identified user.
• Post this step all the user activities will be attributed to the corresponding identified user, even if the user abandons the cart after this.

3. Capturing mobile number for users doing guest checkout

• When a user fills up the form for guest checkout and provides the mobile number in the shipping address details, you now have the option to track this number as user's mobile attribute.
• If the user abandons the cart - this functionality will update user's mobile number attribute basis the abandoned cart event. This will help you send cart recovery SMS to the users who abandoned the cart.
• If the user completes the purchase, the data would get updated as above mentioned in point #1.
• In order to enable this option, head over to the Web assets section and edit the Shopify website asset. Click on Connect or Re-connect Shopify option and select "Sync Shipping mobile number as an attribute" as shown below.

📘

Email ID in case of Shopify by default is considered as Primary Key.

It is also supported on m-sites.