Getting Started

Introduction

On this page, you will be able to find information on how to install the Navilytics script and use it's various features. Should you have a question about something that is not listed on this page, you can contact us via support@navilytics.com at any time.



Installing Navilytics

The Navilytics code used to capture visitor recordings and all data is coded in Javascript, and installing it takes just a few moments. It is designed to load asynchronously, meaning it will not slow down your site.

When you create a new project, you will be redirected to the Code & Settings page for that project. You can also get to this page by simply clicking on the 'Code & Settings' link in the project navigation area. Once you are on this page, you will see a snippet of code on the right side that looks something like this:

<!-- Navilytics -->
<script type="text/javascript" id="__nls_script">
    window.__nls = window.__nls || [];
    (function() {
        var nls = document.createElement('script'); nls.type = 'text/javascript'; nls.async = true; nls.id = '__nls_script_async';
        nls.src = ('https:' == document.location.protocol ? 'https' : 'http') + '://www.navilytics.com/nls.js?mid=&pid=';
        var x = document.getElementsByTagName('script')[0]; x.parentNode.insertBefore(nls, x);
    })();
</script>
<!-- End Navilytics -->

Copy this code (not the code above, but the code from your Code & Settings page) and paste it between the <head> and </head> tags on all of the pages you wish to record. If you are having trouble installing the code, do not hesitate to contact us as we will be happy to assist you!


Wordpress

To install the Navilytics script onto all of the pages of your WordPress blog, follow these steps:

  1. Browse to your WordPress Dashboard
  2. Click on Appearance, then click on Editor
  3. Click on the header.php file on the right. Within this page, find the </head> tag, then copy and paste the Navilytics code right above it

And you're done!

We will soon be offering a plugin to make installing Navilytics on your WordPress blog even easier. Keep an eye on this page and our blog for updates.


Segment.io

Using Segment.io to install Navilytics onto your site is the easiest of all methods! Simply gather your member ID and project ID from your Code & Settings page and enter each one into your Navilytics settings window in Segment.io and save. Navilytics will now run when activated!



Features

Handling Sensitive Data

You may want to use Navilytics on a page where you collect sensitive user information, for instance a checkout page where you need to have visitors enter in a credit card number. By default, Navilytics will automatically ignore all password input fields and never transmit, store, or playback what is entered in. For other input types that you want to ignore, add the nls_protected class to the element.

For example, the code below will tell Navilytics to ignore a credit card number field:

<input type="text" name="cc_number" class="nls_protected" />


Starring Recordings

You can star (favorite) particular recordings and sessions from both your panel and via our Javascript API. This allows you to later find and segment data on these recordings easily.

To star a recording from your panel, visit the Recordings page for your project and hover over any of the listed recorded sessions. When you hover over one, you'll notice a gray star appears to the right in the first column. Clicking on it will star that session and all of it's recordings.

With our Javascript API, you can star individual recordings. When you go to view the recordings for your project, any recorded session listed that has a starred recording that's tied to it will be shown as starred. To star a recording using this method, use the code below. Make sure you place it after the main Navilytics embed code!

<script type="text/javascript">
    //1 = star, 0 = remove star
    __nls.push(['starRecording', 1]);
</script>


Tagging Recordings

Navilytics allows you to store any metadata you want about a specific recording via tags. These tags can then later be used to search and filter data so only specific recordings are shown or used in analysis that are tied to those tags.

A tag is set with a simple function call via our Javascript API. A tag must be a string or an integer and is limited to 255 total characters. You can call the tagging function at any time and anywhere on the page after the Navilytics script. Recordings can have an infinite number of tags.

To set a tag, call the following function, replacing my tag with any tag you want:

<script type="text/javascript">
    __nls.push(['tagRecording', 'my tag']);
</script>


Example of Tracking a Purchase

You can for example track recordings of all users who made a purchase through your site, so later you can segment heatmap and other data to see why they turned into a conversion. To do this you would simply add this code anywhere on your thank you page:

<script type="text/javascript">
    __nls.push(['tagRecording', 'purchase']);
</script>


Example Using jQuery Click Events

If you use jQuery in your code to track clicks on elements, you can use that event to tag a recording. For example, if you track clicks on a button with an id of myButton:

<script type="text/javascript">
    $("#myButton").click(function() {
        //Tag this recording
        __nls.push(['tagRecording', 'my button clicked']);

        //Your code here...
    });
</script>


Page Variations (A/B Testing)

When using the different analysis tools we offer such as click heatmaps, we will by default pull the latest HTML we have stored for the page being requested based on the full page URL. This can be undesireable if you are split testing multiple layouts and variations of the same page.

To tell Navilytics that you are testing a variation of a page, call the following function anywhere on the page after the Navilytics script:

<script type="text/javascript">
    __nls.push(['setVariation', 'Variation Name']);
</script>

Now when you view recordings or analysis data, you can use the Variation option (you must click Show More Options to view it) and choose any variation you would like to segment data on. This allows the proper version of HTML to be loaded, and only data that's specifically tied to that variation will be shown.



Form Analytics

Overview

Navilytics can track how your users interact with forms across the pages on your site. Data captured will allow you to see conversion ratios, field interaction and hesitation times, refill rates and more. Gain valuable insight that will help you to improve your forms.



Tracking Forms

By default, Navilytics will track all forms that have either an id or name attribute. If your form does not use either attribute, you can still track it by identifying it with the nls_fa_name attribute in the same fashion. Similarly, field elements must have either an id, name, or nls_fa_el_name attribute in order to be tracked.

Hidden input types are never tracked in Navilytics. Forms that only contain hidden inputs and/or a submit button are also ignored.



Dynamic Fields

You may have fields within a form that use different id or name attributes based on the end user or a setting, but they are essentially the same field. You can track dynamic fields like this as one field by assigning the nls_fa_el_name attribute to it, using the same name/identifier for each.



Conversion Ratio

When viewing the analysis data for a form, you will be presented with the forms conversion ratio at the very top of the page. This shows the number of users who landed on the form, interacted with it, and eventually submitted it.

The filtering options will affect the data used in calculating the conversion ratio, while the time threshold option only affects forms gathered from the filters. The filters allow you to drill down data to, for instance, see how many Firefox users completed the form compared to Chrome users. If there's a large discrepancy between the two, this could signify errors in the form.



Total Time Report

See how much time is spent on each of the fields of your form and the form as a whole. This report takes into account both interaction and hesitation times of each field (both are explained in greater detail in their sections).

This report is used as a more general overview, whereas the interaction and hesitation reports provide better insight as to how visitors actually use and fill out the form. If your visitors are spending more time on a field or the form than what you would expect however, this could signify that they're encountering errors and possibly having to refill some fields.



Interaction Time Report

Navilytics takes into account even the smallest interactions on a form, calculating things such as the time difference between when a user presses down the left click button and releases it.

Some fields will by default have a much longer interaction time than others (comments, feedback, etc). Visitors spending a long time on a simple field however could signify errors in the field, unclear or void prompts as to what to enter in, or that they're changing their answers.



Hesitation Time Report

There are a number of variables Navilytics will take into account when determining if a user is hesitating or not on a field.

For example, imagine a user hovers their cursor over a field for 2 seconds, clicks on it to focus it which takes a total of 0.3 seconds, then hesitates for another 3 seconds before entering in text for 7 seconds. The hesitation report will then show a total of 5 seconds spent hesitating on that field (while the interaction report will show 7.3 seconds).

If users are hesitating over a field for a long time, it could mean the field is unclear to them. Make sure it's easy to understand what they're supposed to enter.



Refilled Fields Report

If a user enters data in an input, be it text or choosing an option from a radio input, but then goes back and changes what they entered or chose, that field will be considered as having been refilled.

A lot of the time if a user is refilling a field, it's due to them encountering an error when trying to submit it. If your users are continually having to refill answers, you could be losing potential conversions.



Ignored Fields Report

Fields that are left blank are considered ignored. For text fields this means no text was entered in by the visitor. For all other input types, it means no change was made to the selected option by the visitor.

This report shows the percentage of the time each field is ignored. For example, if you have 10 visitors and only 2 of them entered text to an email address field, the report will show that it was ignored 80% of the time.



API

Navilytics offers an API which allows you to pull data from your account using a simple URL. The API is organized around the REST protocol.

Getting Started

You must have a valid API key linked to your account in order to use the API. This can be found on your Account page in your member panel. If an API key is not already listed there, you can create a new one by clicking on the Generate Key button.

Authentication

The API uses HTTP Basic Auth to authenticate your request. You must include your API key in every request to identify you.

All requests should be made over the HTTPS (SSL) protocol.

Errors

Navilytics uses the conventional HTTP response codes in the 2xx-5xx range to indicate either success or failure of an API request.

200 - OK - Everything worked correctly and the response returned.
400 - Bad Request - You may be missing a required parameter.
401 - Unauthorized - No valid API key provided.
402 - Request Failed - Arguments valid, but failure to contact the API.
404 - Not Found - The requested API endpoint does not exist.
5xx - Server errors - Something went wrong on our end.

When possible, the response will contain an error object describing what happened.

{
    "error": "No API Key provided"
}


Sessions

This API request allows you to pull sessions from your Navilytics account.

Definition

GET https://www.navilytics.com/api/v1/sessions

Example Request


$ curl https://www.navilytics.com/api/v1/sessions -u YOUR_API_KEY:x


Arguments

Name Type Default Description
pid integer null Only return sessions that are tied to this project ID.
tag mixed null Only return sessions that have been tagged with this tag.
page integer null A way to paginate the returned data. Works together with the limit argument.
limit integer 10 Maximum number of sessions to return in the request.
order char DESC Orders the sessions. Value can either be ASC for ascending or DESC for descending. Order is based on last_activity date.

Example Response


{
    "sessions": [{
        "id": "123456",
        "last_activity": "2015-01-01 12:34:56",
        "country": "United States",
        "country_code": "US",
        "ip": 127.0.0.1,
        "total_pages": "3",
        "total_duration": "1234567",
        "total_movements": "123",
        "total_clicks": "12",
        "total_key_presses": "1",
        "browser": "Firefox",
        "browser_version": "34.0",
        "platform": "Win7",
        "recording_id": "1234567",
        "start_page": "Navilytics - Website Recordings, Heatmaps, and Analytics",
        "start_page_url": "https:\/\/www.navilytics.com\/",
        "playback_url": "https:\/\/www.navilytics.com\/member\/viewer?sid=123456&shid=FFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFF",
        "source": "Direct",
        "starred": true,
        "tags": ["tag one", "tag two"]
    }, ...],
    "count": 1234,
    "next_page": 2,
    "previous_page": null
}