Question

I am attempting to serve different phone numbers on a site based on a number of factors, allowing us to track inbound phone calls based on how users arrived at the page.

1. Check to see if user is coming from advertising by checking for “?provider=” querystring, serve advertising number if present
2. If not, check userAgent to serve “default” number to bots
3. If userAgent is not a bot, check referrer and serve different tracking number based on common SERP clicks

This site is unable to run server-side scripting so this has to be done with javascript (which I am fairly inexperienced with). I’ve cobbled together bits and pieces but ultimately would like to combine everything and have it work together in a single .js file that can be called on page load.

Here’s what I have so far:

<script type="text/javascript">
//Querystring to check if paid session or organic
     function providercheck() {
        var str= location.href;
            if (str.indexOf("?provider=") > -1) {
                document.write("paid phone number");
            }
            else {
                botcheck();
            }
    }

    //Check userAgent to serve organic number to bots
     function botcheck() { 
            if(navigator.userAgent.toLowerCase().indexOf("googlebot") <= -1) {
                    document.write("default phone number");
                }
            else {
                    refcheck();
                }
    }

    //Check for referrer and serve number based on last referrer
    function refcheck() {
        var last_referrer = document.referrer;
        if (last_referrer.indexOf("google") > -1) {
            document.write("google tracking number");
        }
        else if (last_referrer.indexOf("yahoo") > -1) {
            document.write("yahoo tracking number");
        }
        else {
            document.write("default number");
        }
    }
</script>

Any help or guidance is very appreciated. I also need to set a session cookie to continue to serve the same number until a user leaves the site, but wanted to get this working first

Answer 1

You could try something like this:

put this span somewhere on your page:

<span id="phoneNumber">Superdefaultnumber</span>

And then this code in a script tag in the head of your document:

var setNumber = function(){
    var spanNode = document.getElementById("phoneNumber");
    if (!spanNode) {throw new Error("Unable to find span");}

    if (location.href.indexOf("?provider=") > -1) {
        spanNode.innerHTML = "paid phone number";
    }    

    //Check userAgent to serve organic number to bots
    if(navigator.userAgent.toLowerCase().indexOf("googlebot") <= -1) {
        spanNode.innerHTML = "default phone number";
    }

    //Check for referrer and serve number based on last referrer
    var last_referrer = document.referrer;
    if (last_referrer.indexOf("google") > -1) {
        spanNode.innerHTML = "google tracking number";
    }
    else if (last_referrer.indexOf("yahoo") > -1) {
        spanNode.innerHTML = "yahoo tracking number";
    }
    else {
        spanNode.innerHTML = "default number";
    }    
};


window.addEventListener("load", setNumber);