Lead Tracker API

Lead Tracker API allows Voicenter customers to track incoming calls from your websites, mini-sites, landing pages, etc. It is mainly used when you wish to follow, examine and diagnose how many calls were received from clients who had left their contact info on your various online platforms. Was the caller referred to you from the website via Facebook, Google Ads, etc. Use the following easy-to-implement JS script for advertisement tracking of calling numbers from your websites.
did tracker api scheme

 

General Explanation

 

This API gives you a lot of tools and access to vital information such as which client/lead had left their contact details on your landing page.
Did that client receive a call? And in case they did, did the call help convert the lead to an existing client?

This API can measure the effectiveness of your Google ads, landing pages and any other web advertisement you may have.

All you have to do is follow the JS script shown below.

 

init method accepts the following arguments:

 

Argument Accepts Example Description
tokenStringxxxxxxxxxyyyyyyyyyyyyyzzzzzzzzzzzThis Token will be provided by Voicenter and will be assigned to a pool of DIDs (phone numbers) associated under the same “lead tracker” settings.
visitorInfoobject{ “glid”:”wqer54ytw345uye589y”, “fname”:”Chuck Norris” }Any object which will be send to Lead Tracker API to be temporarily stored and assigned to this DID.
actionsobjectsee examples belowList of actions to perform on a list of selectors (html elements).
actions.callarraysee examples belowList of selectors to which will be applied 'click' listener to make a call (tel: to dial) to a DID.
actions.hrefarraysee examples belowList of selectors which hrefs will be replaced with DID.
actions.textarraysee examples belowList of selectors which text will be replaced with DID.

Actions Examples

call_example.html

 

You can view this action's CDN here.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
          
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>LEAD TRACKER EXAMPLE</title>
</head>
<body>
<button class="call-me">
Call Me by class
</button>
<button id="callMe">
Call Me by id
</button>
<script type="text/javascript" src="https://cdn.voicenter.co/cdn/Scripts/did_trace_worker/index.min.js"></script>
<script type="text/javascript">
VC_DID_TRACKER.init(
'token',
{
name: 'John Doe'
},
{
call: ['.call-me', '#callMe']
})
</script>
</body>
</html>
        

 

 

 

href_example.html

 

You can view this action's CDN here.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
          
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>LEAD TRACKER EXAMPLE</title>
</head>
<body>
<a href="test" class="replace-my-href">
I will have a new href by class
</a>
<br>
<a href="test" id="replaceMyHref">
I will have a new href by id
</a>
<script type="text/javascript" src="https://cdn.voicenter.co/cdn/Scripts/did_trace_worker/index.min.js"></script>
<script type="text/javascript">
VC_DID_TRACKER.init(
'token',
{
name: 'John Doe'
},
{
href: ['.replace-my-href', '#replaceMyHref']
})
</script>
</body>
</html>
        

 

 

 

text_example.html

 

You can view this action's CDN here.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
          
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>LEAD TRACKER EXAMPLE</title>
</head>
<body>
<p class="replace-me">
I will be replaced by class
</p>
<p id="replaceMe">
I will be replaced by id
</p>
<script type="text/javascript" src="https://cdn.voicenter.co/cdn/Scripts/did_trace_worker/index.min.js"></script>
<script type="text/javascript">
VC_DID_TRACKER.init(
'token',
{
name: 'John Doe'
},
{
text: ['.replace-me', '#replaceMe']
})
</script>
</body>
</html>
        

 

 

 

no_action_example.html

 

You can view this action's CDN here.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
          
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>LEAD TRACKER EXAMPLE</title>
</head>
<body>
<script type="text/javascript" src="https://cdn.voicenter.co/cdn/Scripts/did_trace_worker/index.min.js"></script>
<script type="text/javascript">
VC_DID_TRACKER.init(
'token',
{
name: 'John Doe'
})
.then(function (DID) {
console.log(`DID: ${DID}`)
})
</script>
</body>
</html>
        

 

 

Index.min.js backend file

 

This javascript file should be included in your HTML file for the function to work.
The content is also available here.
So you can easily copy-paste this in the html body (as shown in previous examples):

1
          
const VC_DID_TRACKER=function(){const t={href:[],text:[],call:[]},e="voicenter_did_tracer_did",n="voicenter_did_tracer_did_exp",o="voicenter_did_trace_worker_query_params";let i={};function r(){const t={},e=new URLSearchParams(window.location.search);for(const n of e)t[n[0]]=n[1];return t}function c(){return!!i.actions.href&&!!i.actions.href.length}function a(){return!!i.actions.text&&!!i.actions.text.length}function s(){return!!i.actions.call&&!!i.actions.call.length}function f(t,e){t.forEach((function(t){try{[...document.querySelectorAll(t)].forEach((function(t){e(t)}))}catch(t){console.error("[VOICENTER_DID_TRACKER]:",t)}}))}function u(){return localStorage.getItem(e)}function l(){window.location.href=`tel:${u()}`}function d(t=!1){if(!t&&u()){if((localStorage.getItem(n)||0)>(new Date).getTime())return Promise.resolve()}return function(t="",e={}){try{return fetch(t,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify(e)}).then((function(t){return t.json()}))}catch(t){console.error("[VOICENTER_DID_TRACKER]:",t)}}(`https://did.voicenter.co/didTracker/getDidForUser?token=${i.token}`,i.visitorInfo).then((function(t){const o=t.did;let r=60*t.didExpiryHours*60*1e3;localStorage.setItem(n,(new Date).setTime((new Date).getTime()+r)),localStorage.setItem(e,o),window.voicenter_did_tracer_did=o,i.autoRefreshDID&&setTimeout((function(){d(!0).then((function(){h(),_(),m()}))}),r-5e3)}))}function h(){c()&&f(i.actions.href,(function(t){t.href=`tel:${u()}`}))}function _(){a()&&f(i.actions.text,(function(t){t.innerText=u()}))}function m(){s()&&f(i.actions.call,(function(t){t.addEventListener("click",(function(){u()?l():d().then(l)}))}))}return{init:function(e,n={},f=t,l=!0,g=!0){if(i={token:e,visitorInfo:{...n,siteDomain:window.location.hostname,currentPage:window.location.href},actions:f,autoRefreshDID:l},i.token||console.error("[VOICENTER_DID_TRACKER]: Token must be provided"),g){let t=localStorage.getItem(o);const e=r();t&&(t=JSON.parse(t),Object.assign(i.visitorInfo,t.visitorInfo)),Object.assign(i.visitorInfo,e),localStorage.removeItem(o),localStorage.setItem(o,JSON.stringify(i))}return c()||a()||s()?c()||a()?new Promise((function(t){d().then((function(){h(),_()})).then((function(){t(u())}))})):(s()&&m(),Promise.resolve()):d().then(u)}}}();