SaaS JavaScript Code Examples
Introduction
Below is some basic information for you to get started with Kissmetrics. Please let your account manager know if you need information outside of our JavaScript API. Everything in <<double brackets>> needs to be replaced with an element ID or a variable.
Getting Started
First step is to implement your JavaScript code block in the header of all of your pages. This will track all of our automatic events and properties like Visited Site and Ad Campaign Hit. Be sure to use UTM parameters with any ads in order to track the details of the ads.
Track Custom Info
Now you want to track any pre-sign up activity. This could be watching a video on your home page or viewing a particular page (i.e. pricing page).
_kmq.push(['record', 'Viewed Pricing Page']);
_kmq.push(['record', 'Watched Video', {'Video Watched':'<<Yes>>'}]);Your customer is ready to sign up or start a trial. You will want to track the registration process and Identify the user when they provide their email address. Remember, you can use our trackSubmit API call to track any form and identify users all at once!
_kmq.push(['trackSubmit', '<<ELEMENT_ID_OR_CLASS>>', 'Signed Up']);If you have a free trial and then a paid trial, you will want to track when someone is billed and upgrades their account:
_kmq.push(['record', 'Upgraded', {'Upgrade Plan':'<<Pro>>'}]);
_kmq.push(['record', 'Billed', {'Billing Plan':'<<Pro>>', 'Billing Amount':<<99.95>>}]);You are now tracking free users and users on your paid account. You also have revenue information coming in from the Billing Amount property. It is time to start tracking your key features so you can see what makes your customers successful:
_kmq.push(['record', '<<Your Key Action>>']);
_kmq.push(['record', '<<Your Other Key Action>>', {'<<Details of Key Action>>':'<<Value>>'}]);If you have any element or button you want to track, you can use our trackClick API call. Here is an example of someone clicking on the Invite button.
_kmq.push(['trackClick', '<<ELEMENT_ID_OR_CLASS>>', 'Invite Friends Clicked']);Identifying Your Users
Finally, if you were not able to identify your user when they signed up with our trackSubmit call (example above), you can use our identify call and manually ID the customer:
_kmq.push(['identify', '<<bob@bob.com>>']);Integrations
Be sure to look at our integration page to see if you can easily pass us in information from your other tools. Mailchimp, Optimizely and VWO are the most popular tools we integrate with.
Troubleshooting
You will need to use our Live Stream or your browser’s developer tools to make sure the events and properties are coming in correctly. You do not need to wait 30 minutes to see if the information is correct. This will speed up your implementation tremendously.