Web SDK

LivePinch provides a WebSDK that you can integrate with your website, and with minimal effort start tracking user. LivePinch Web SDK provides following features.

  • Track users
  • Track automatically certain events such as page views, form submits, clicks on the website
  • Manages push notification subscriptions
  • Presents and collects survey responses that may have been assigned to the user

To integrate LivePinch WebSDK you simply include following code

1
 (function(e,r){var i={minify:true,app_namespace:"LP",tracker_url:"//track.livepinch.com/client-api/v1/track",script_url:"//track.livepinch.com/client/0.5.0/client.js",survey_base:"//app.livepinch.com/forms/_s/",web_push_frame_id:"lp-push-frame",global_prefix:"LP",version:"0.5.0",debug:false};if(typeof e.LP=="undefined"){e.LP={__queue:[],version:"0.5.0",config:{},user:{},event:{},survey:{}};var t="isInitialized namespace licenseKey".split(" ");var n="login logout getAttributes setAttributes".split(" ");var a="isLoggedIn uuid profileId".split(" ");var s="track pageView screenView".split(" ");var u=["show"];var l=function(){return null};var c=function(r){return function(){e.LP.__queue.push([r,arguments])}};for(var o=0;o<t.length;o++){e.LP[t[o]]=l}for(var o=0;o<n.length;o++){e.LP.user[n[o]]=c("LP.user."+n[o])}for(var o=0;o<a.length;o++){e.LP.user[a[o]]=l}for(var o=0;o<s.length;o++){e.LP.event[s[o]]=c("LP.event."+s[o])}for(var o=0;o<u.length;o++){e.LP.survey[s[o]]=c("LP.survey."+s[o])}e.LP.initialize=c("LP.initialize");setTimeout(function(){var e=r.createElement("script");e.async=true;e.src=i.script_url+"?rand="+Math.random();r.body.appendChild(e)},100)}})(window,document);

After including the snippet above, You will need to initialize the SDK with

1
LP.initialize("YOUR LICENSE KEY", options);

See Get License Keys on how to obtain license key from your dashboard.

Options is a JavaScript object, you could pass additional configuration options to the LivePinch altering its behavior. Following options are accepted.

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
 {
   "web_push": true,
   "surveys": true,
   "in_app": true,

   "automatically_track_page_views": true,
   "automatically_track_clicks": true,

   "dont_track": false
 }

Here each of these options are discussed more in detail

web_push must be a boolean, or a callback, defaults to true if its a callback, callback will be run in a boolean context. If value evaluates to false. Web Push not be enabled on this client. No prompts will be shown to the user.

surveys must be a boolean, or a callback, if its a callback, callback will be run in a boolean context. If value evaluates to false, Surveys and feedback will not be collected from this client

in_app must be a boolean, or a callback, if its a callback, callback will be run in a boolean context. If value evaluates to false, No in app messages will be shown to this client.

automatically_track_page_views must be a boolean, or a callback, if its a callback, callback will be run in a boolean context. If value evaluates to false, No in app messages will be shown to this client.

automatically_track_clicks must be a boolean, or a callback, if its a callback, callback will be run in a boolean context. If value evaluates to false, link tracking automatically will be disabled.

dont_track must be a boolean, or a callback, if its a callback, callback will be run in a boolean context. If this value evaluates to true. The SDK will stop tracking the user, events, page views. Will not display In App or Push Notifications. Client will be completely disabled.

User Login/Logout

By default, Live Pinch tracks all users, and assigns a unique id to every user in order to identify a given user, it is important that you call login method onces a user logs in, and logout method when the user signs out.

Once login is called, All events, page views, clicks, sessions and actions are attributed to the logged in user, until a logout action is called.

Login method accepts a profile_key as an argument. See Profiles section for details on profile_key. Profile Key is a unique identifier for the user on your system, It could be an email, phone or profile_name any other unique identifier you identify the user with

To Login

1
LP.user.login("profile_key")

Logout must be called when the user logs out of your system or his session times out. When a logout is called. A new anonymous user is created and returning user is tracked under this anonymous Id.

1
LP.user.logout()

Set User Attributes

You can set arbitrary attributes for a given profile. See Profiles section for details on the attributes.

1
2
3
4
5
6
7
8
LP.user.setUserAttributes({
 first_name: "John",
 last_name: "Doe",
 gender: "male",
 dob: "1979-05-25",
 custom_variable: 25.5,
 membership_level: "GOLD"
})

Set a Single Attribute

You can set a single attribute on the given profile (Anonymous/Non Anonymous) using setAttribute method call

1
2
LP.user.setUserAttribute("first_name", "John");
LP.user.setUserAttribute("last_name", "Doe");

Logged In Check

Check if a given user is known/logged in user

1
LP.user.isLoggedIn()

Anonymous User Check

Check if the given user is anonymous

1
LP.user.isAnonymous()

Get Profile Key

Get profile_key of current logged in user

1
LP.user.profileKey()

Set UTM Parameters

By default, LivePinch will detect the UTM parameters and set the profile’s acquisistion details and track all events with these details. These details are usually picked from the URL parameters. If you would like to override these details, you can set them manually.

1
2
3
4
5
6
7
8
LP.user.setUTM({
 source: "google",
 medium: "email",
 keywords: "...",
 content: "...",
 term: "...",
 campaign: "..."
})

Get UTM Parameters

Get the UTM associated with the current profile

1
LP.user.getUTM()

Track Events

Track any custom event the user performs with track event, The first argument is a string, Must be the name of the event, Second attribute is an object containing any arbitrary set of attributes and values that can be associated with this event.

1
2
3
4
5
LP.event.track("Added to Cart", {
 "Product Id": 23535,
 "Product Category": "shoes",
 "Product Color": "red",
});

Set Page View

By default LivePinch* tracks all page views. The the page view label is set the the title of the page, by inspecting the DOM. If that is not available, URL is used as the page name. If you’re running a SPA, You can manually record page view changes by calling pageView method

1
LP.event.pageView("Screen Name")

Show Survey

See Survey section on how to create, configure and setup surveys. Once you have surveys created, You can manually show the survey to the user by calling show method.

1
LP.survey.show("<survey_id>")

Note

If the logged in user has already responded to this survey. This method will silently ignore this call. Also, in order to avoid fatigue to the user, If user has already responded to a survey within a configured amount of time, Default is 1 hour. Another survey will not be shown until expiry of that period. The call will silently fail.