Code Deployment- Parallax Websites

This document details how to deploy the WOW Analytics (GatorLeads) tracking codes to a website page where the code and the structure of the page require custom elements to be passed back to our application.

Using GatorLeads on Parallax websites

The term ‘parallax’ refers to the apparent movement of objects when viewed from different positions to create a sensation of depth or distance to your web site.

Most web sites that use Parallax scrolling have one-page design which means all your web assets are loaded into a single page. Which in terms of your web analytics solution and IP tracking tool, a common side effect is you start to see single visits to your web site as opposed to every menu click. For those that did not know WOW does have a solution to this, here’s how WOW can track all your website clicks.

In addition to the standard WOW tracking code (no change there so leave as is), then please pass this code to your web designer/developer. This code needs to be placed on the page load function of your site and basically makes sure that every navigation click on your web site fires the WOW tracking code. This code may require some slight modification or may even need to be deployed specifically to your web site’s CMS platform.

Code example for Parallax site

jQuery(function () {

// Configure WOW to track the top menu

jQuery('#nav a').on('click', function () {

// get the custom title

var element = jQuery(this);

var title = element.html();

var url = element.attr('href');

// if the url starts with a # then it is an anchor tag

if (url[0] === '#')

url = document.baseURI + url;

// add the

_wow.push(['trackPageView', title, url]);

});

Using custom values

You can pass custom data back from a web page to three custom fields (val1 val2 val3). Data passed back to these fields will be stored against a tracked link, but these are not useable in the front end of the application. To access or use the data stored against these fields would require custom development.

Code example for custom values

<!-- WOW Async Tracking Code Start -->

<script type='text/javascript'>

              var _wow = _wow || [];

              (function () {

              try{

                              _wow.push(['setClientId', 'insert client code']);

                              _wow.push(['enableDownloadTracking']);

                             // set custom values

                             _wow.push([‘SetCustomData’, ‘val1’, ‘val2’, ‘val3’]);

                            // track page

                              _wow.push(['trackPageView']);

                              var d = document, g = d.createElement('script'), s = d.getElementsByTagName('script')[0];

                              g.type = 'text/javascript'; g.defer = true; g.async = true;

                              g.src = '//t.wowanalytics.co.uk/Scripts/tracker.js';

                              s.parentNode.insertBefore(g, s);

              }catch(err){}})();

</script>

Using section headers

For web pages which have sections that need to be tracked separately, each section can be coded with a title that will pass back as a separately identifiable page in our page scoring utility. By passing these values back, you can then identify visitors to specific sections of a web page and give those sections their own scores and categories.

Code example for section headers

<section class="example" data-wow-title="insert title" id="insert id">

0 Comments

Add your comment

This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.