Tracking script

Table of Contents

  • Prerequisites
  • Compatibility
  • Installing the Script
    • Method 1: Installation on Static Pages
    • Method 2: Installation on a Dynamic Site
    • Method 3: Installation via Google Tag Manager
    • Method 4: Installation on WordPress
  • Verification of the Installation
  • Advanced Use
  • FAQ
    • How to install the tracking on the Hubspot appointment scheduling module?
    • How to measure conversions from Appvizer?

Prerequisites

  • You must know your software identifier(s) in the form “AP-XXXXX”. The identifier is located in the URL of the profile editing page accessible from the seller’s account:
In this example the identifier is “AP-25655”
  • Each code corresponds to a single software referenced in Appvizer.
  • In some cases you will have to use several codes.

Compatibility

The global mechanism is compatible with all browsers except IE 11+ and, if compatibility mode is not enabled IE 7+.

Important Note: The script is not compatible with PhantomJS or any other server-side rendering mode (SSR) that does not provide a window or document .

Installing the Script

Two methods of installation are possible depending on the site that will host the code:

  1. On classic sites with fixed pages (WordPress, Joomla!, etc.) where a link leads to a page change;
  2. On a “single-page” site (Angular, React, etc.) or any site whose content is dynamically loaded.

Method 1: Installation on Static Pages

In the case of static pages, the first code must be inserted on the landing page and the second on the conversion page, making sure to modify the following two elements:

  • The correct software identifier in the of AP-XXXXX that can be found in the URL of your product page

1. First code to be inserted on the landing page

The software identifier is to be modified on line 12:

 
<script type="text/javascript">
(function (w, d, id) {
if(w.av) { return; } 
var ts = new Date().getTime();
w.avURL = w.avURL || 'https://appvizer.one';
w.avPool = w.avPool || [];
w.avPool.push({start: ts, id: id});
w.av = function () { w.avPool.push(arguments) };
var e = document.createElement("script");
e.async = true;
e.src = w.avURL + '/ariadne/v1/ariadne.js?ts=' + ts;
d.getElementsByTagName("head")[0].appendChild(e);
})(window, document, 'AP-XXXXX');
av("visit");
</script>

Example with 2 software programs

The software identifiers to be modified are on lines 13 and 14

<script type="text/javascript"> 
(function (w, d, id) {
if(w.av) { return; } 
var ts = new Date().getTime();
w.avURL = w.avURL || 'https://appvizer.one';
w.avPool = w.avPool || [];
w.avPool.push({start: ts, id: id});
w.av = function () { w.avPool.push(arguments) };
var e = document.createElement("script");
e.async = true;
e.src = w.avURL + '/ariadne/v1/ariadne.js?ts=' + ts;
d.getElementsByTagName("head")[0].appendChild(e);
})(window, document);
av("visit", {id: 'AP-XXXXX'});
av("visit", {id: 'AP-YYYYY'});
</script>
 

2. Second code to install on conversion actions or associated thank you pages

 
<script type="text/javascript">
(function (w, d, id) {
if(w.av) { return; } 
var ts = new Date().getTime();
w.avURL = w.avURL || 'https://appvizer.one';
w.avPool = w.avPool || [];
w.avPool.push({start: ts, id: id});
w.av = function () { w.avPool.push(arguments) };
var e = document.createElement("script");
e.async = true;
e.src = w.avURL + '/ariadne/v1/ariadne.js?ts=' + ts;
d.getElementsByTagName("head")[0].appendChild(e);
})(window, document, 'AP-XXXXX');
av("conversion");
</script>

Example with 2 software programs

The software identifiers to be modified are on lines 13 and 14

<script type="text/javascript">
(function (w, d, id) {
if(w.av) { return; } 
var ts = new Date().getTime();
w.avURL = w.avURL || 'https://appvizer.one';
w.avPool = w.avPool || [];
w.avPool.push({start: ts, id: id});
w.av = function () { w.avPool.push(arguments) };
var e = document.createElement("script");
e.async = true;
e.src = w.avURL + '/ariadne/v1/ariadne.js?ts=' + ts;
d.getElementsByTagName("head")[0].appendChild(e);
})(window, document);
av("conversion", {id: 'AP-XXXXX'});
av("conversion", {id: 'AP-YYYYY'});
</script>

 

 

Do not forget to check the technical installation through this section.

Method 2: Installation on a Dynamic Site

For sites such as Angular, React, etc, the tracking script is loaded once to load the site and then called upon request. This method is also suitable for sites with multiple software on one page.

The general code (1) must be called before the others. A good practice is to put in the <head> section and the other two (2) and (3) in the <body> section,

1. General code to call in the <head> section

<script type="text/javascript">
(function(w, d, id){
if(w.av) { return; }
var ts = new Date().getTime();
w.avURL = w.avURL || 'https://appvizer.one';
w.avPool = w.avPool || [];
w.avPool.push({start: ts, id: id});
w.av = function () { w.avPool.push(arguments) };
var e = document.createElement("script");
e.async = true;
e.src = w.avURL + '/ariadne/v1/ariadne.js?ts=' + ts;
d.getElementsByTagName("head")[0].appendChild(e);
})(window, document);
</script>

 2. Code to be inserted on the landing page in the <body> section

This can be the registration form, the software page or a registration popup

<script type="text/javascript">
av("visit", {id: 'AP-XXXXX'});
</script>

Example with 2 software programs

 

3. Code to install on conversion actions or thank you pages in the section

<script type ="text/javascript">
av("conversion", {id : 'AP-XXXXX'});
</script>

 

Example with 2 software programs

 

The conversion code can also be inserted into a button:

<button onclick="av('conversion', {id: 'AP-XXXXX'});">Conversion</button>

The conversion code can also be inserted in a hypertext link:

<a href=”http://...” onclick="av('conversion', {id: 'AP-XXXXX'});">Conversion</a>

Method 3: Installation via Google Tag Manager

To install Appvizer scripts via Google Tag Manager on your site, simply:

  1. Add a new tag for “visit” event;
  2. Select a custom HTML tag type;
  3. Insert the script in the HTML field of the page explained in Method 1;
  4. Choose a trigger according to your needs;
  5. Save.

Repeat exactly the same steps for the “conversion” event by referring to method 1.

Method 4: Installation on WordPress

The Appvizer tracking script is compatible with WordPress. Find out how to set it up.

Verification of the Installation

To verify that the installation has been carried out correctly, here are the different steps:

    1. Open the browser console;
    2. Go to the “Network” tab and then to the “XHR” tab;
    3. Check the “Preserve logs” option;
    4. Launch the event by refreshing the page, for example;
    5. Search for the term “appvizer” in queries: a query called “external-event” of the post type must be present. If you don’t find these events, the script is not properly installed.
    6. Check the details of the information sent. The detail should be as follow:
{id: "AP-XXXXX", externalId: XXXXXXXX, event: "conversion"}
event: "conversion"
externalId: 1570191937253
id: "AP-XXXXX"

If the field “event” does not have the right visit or conversion tag and the id field is not yours, the script is not installed correctly.

Advanced Use

For advanced users, here is the release of the Conversion Tracking API. The global function av(), accepts objects with the following properties:

 
  Type Infos Valeurs Exemple
event string type d'événement visit, conversion "visit"
id string identifiant du logiciel cf appvizer "AP-1234"
 
<script type="text/javascript">
av({event: "visit", id: 'AP-1234'});
</script>

FAQ

How to install the tracking on the Hubspot appointment scheduling module?

It is now possible to add a redirection page at the end of the booking process on which the script will be installed.

How to measure conversions from Appvizer?

Everything is explained in this article.