Our webpage tracking feature uses a simple Javascript to pull the entire URL of a webpage your contact is visiting and writes it into your BenchmarkONE database. This is handy when you're trying to track the engagement of your contacts, but it can get messy when you have either long query strings, temporary login tokens, or a very deep directory structure that is far more detailed than is useful. Luckily, our script can be modified a bit to trim subdirectories from being tracked in BenchmarkONE.
First, let's take a look at the standard tracking code. I've added line breaks and indentation for readability:
(function () {
var url = window.location;
var oImg = document.createElement("img");
oImg.setAttribute('src','https://app.hatchbuck.com/TrackWebPage?ACID=226&URL=' + url);
})();
There are two important things to note about this code. First, look at line 5. This is the part of the tracking code that ties the data to your account. That "ACCID" value is your account id. This example is using account id 266. You will need to change this number to match the tracking code for your account, which can be found by going to Tools --> Webpage Tracking --> Click on any URL. Be positive to change nothing besides the numbers; do not add quotes or spaces.
Now, the magic. Line 3 is assigning the URL of the webpage to the variable url, which is then being appended as a query string to our tracking API call. Like you'd expect, this can be manipulated. In this article, we will focus on how to trim trailing subdirectories from the URL being tracked. We can do this using standard Javascript functions in a single line of code. Here's the code... the only change is on line 3:
(function () {
var url = window.location.href.split('/', 4).join('/');
var oImg = document.createElement("img");
oImg.setAttribute('src','https://app.hatchbuck.com/TrackWebPage?ACID=226&URL=' + url);
})();
So what did we do? Well first, we pulled the href property of window.location, which gives us a string we can manipulate easily.
Next, we used Javascript's split() function to create an array of the different sections in the URL. The parameters are a forward slash (indicating the delimiter) and the number 4. That 4 means we want to push the first 4 sections into the array, but no more. Since we are splitting by slashes, you need to account for the double slashes following http. So if your URL is http://www.hatchbuck.com/blog/small-business-help, split('/', 4) creates an array like this:
['http', '', 'www.hatchbuck.com', 'blog']
The 5th array element ('small-business-help') is dropped since we limited the array to only 4 elements. The only thing left to do now is join the elements back into a string. We do this with the join() function. We send a parameter to denote the new delimiter (a forward slash), and it assembles the new URL for us. When fed that same example URL (http://www.hatchbuck.com/blog/small-business-help), this whole line of code essentially boils down to this:
var url = 'http://www.hatchbuck.com/blog';
You can change the split parameter to allow more or fewer subdirectories, or you can even use REGEX or find() to manipulate your results even further.
Good luck!