Track Multiple Traffic Sources with One LeadOutcome Lead Capture Form

Track Multiple Traffic Sources with One LeadOutcome Lead Capture Form

One of the shortcomings of LeadOutcome is the lack of ability to copy lead capture forms.  This makes making copies of forms a time consuming process if you want to change the AdCode field to track a new traffic source.   You can not track multiple traffic sources with one LeadOutcome lead capture form.To add insult to injury you can’t modify the AdCode field in the code that LO generates as it is not present.  Whats a person to do?  I had resolved myself to re-creating the same forms.

A Chance Discovery

I bit of time later when working on my WordPress site I was typing in a URL and had made a mistake adding an extra character at the end after the /.  To my surprise the same page came up that I was looking for.

http://www.ownyoursocial.com/social-business-development-assessment/

Is the same as…

http://www.ownyoursocial.com/social-business-development-assessment/?ref=BlogPost

To WordPress.

Track multiple Traffic sources with One LeadOutcome Lead Capture Form

It got me thinking of how affiliate links work.   My Repwarn link for example, looks like this:

 http://repwarn.com/?hop=davidmckeen

You can call the same page with a parameter and have it read by the a page.  I wondered if I could do the same thing somehow with LeadOutcome and WordPress.  That way I could track multiple traffic sources with one LeadOutcome lead capture form.

I reached out to a coder friend of mine to ask how this worked.  He set up a quick proof of concept of this so that I could see what the code looked like for it.  He had no idea if this would work with WordPress, but I decided that I would give it a try to make it work.  He provided me with this piece of code.

<script>
function getParameterByName(name, url) {
if (!url) url = window.location.href;
name = name.replace(/[\[\]]/g, "\\$&");
var regex = new RegExp("[?&]" + name + "(=([^&#]*)|&|#|$)"),
results = regex.exec(url);
if (!results) return null;
if (!results[2]) return '';
return decodeURIComponent(results[2].replace(/\+/g, " "));
}
function getReference() {
document.getElementsByName("leadCapture_leadSource")[0].value += '-' + getParameterByName("ref");
}
</script>
<script> getReference() </script>

What this All Does

I’m not sure what everything does here to be honest.  I’m not a coder, so don’t be worried at this point.  I’ll give you a step by step how t use this.  The getParameterByName fucntion I know parses out the URL to grab whatever is at the end of it.  How it does it I’m not so sure but his function name says it all.  The function getReference() grabs what is in the ref parameter as sets it the the leadcapture_leadsource field.    The last bit here that is all alone in the two script tags calls the function so it can do its work.

Why Would You Want to Track Multiple Traffic Sources with One LeadOutcome Lead Capture Form?

The main answer is TIME..  I always am making a trade off in how much time it will take me to make the same form again vs if something is worth testing.  I want to make sure that I am not running up huge hours for my clients because I am doing something in an inefficient way.  This allows me to over-deliver to my clients and provide more value.

This also greatly increases the functionality of what can be done with a single form. I can give specialized links to whoever I want and track what leads they send my way and compensate them without having to set up a affiliate tracking system.  Then I can see the partners who are really helping me vs. people who are saying they are doing things and focus on the best partners.

Disclaimers and Other Notes Before We Start

I’ve only tested this in the 4.4.2 version of WordPress so your mileage may vary.  Since the AdCode field is not accessible from the code that LO generates, we are using the Lead Source field instead.  Normally the name of the form is put in this field in LO.  We are still using this, but appending whatever is used in the URL for the ref value with a dash in between.  This can b modified of course.  You could use the AdCode field as the name of the form or its purpose and just put the ref value in the LeadSource field.  Either way has its benifits.  We also are using the LeadOutcome plugin to insert our form code into our site as well as the script shown above.  I tried other methods, but this was the one I got to work so I’m sticking with it.  I think it has to do with the elevated rights that the plugin has vs the editor window for posts.  If you find another way to make this work, let me know in the comments please.  Others maybe able to benefit from an alternate method.

Walk-Through: Track Multiple Traffic Sources with one LeadOutcome Lead Capture Form.

Ok.  So to start lets open up out LeadOutcome plugin and go to the opt-in forms area and open up the form that you want to try this out with.  If you are using anything other than a “plain jane” form, you will need to find the end of the style tag and before the div that has the “lo-wrapper” in it.  You can see here in the screenshot the </style> tag and the start of the <div id tag right afterwards that has the lo-wrapper.

LO Form Code 1

You are going to want to hit enter a few times to make some space here as the first piece of code is going to be inserted between these two tags.  Grab the code bellow and copy and paste in the space you just created.

<script>
function getParameterByName(name, url) {
if (!url) url = window.location.href;
name = name.replace(/[\[\]]/g, "\\$&");
var regex = new RegExp("[?&]" + name + "(=([^&#]*)|&|#|$)"),
results = regex.exec(url);
if (!results) return null;
if (!results[2]) return '';
return decodeURIComponent(results[2].replace(/\+/g, " "));
}
function getReference() {
document.getElementsByName("leadCapture_leadSource")[0].value += '-' + getParameterByName("ref");
}
</script>

Once this is done you are going to want find another place in the LO form code where a script executes.  Luckily this is really easy.  We just need to scroll down to the bottom of the code to find it.  We are looking for the <!– end form –> tag which is right above where some other script type stuff is happening.

LO Form Code 2

Hit enter a few times again after the <!– end form –> to make some room and paste this in:

<script> getReference() </script>

Then click save changes.  That is it unless it doesn’t work.  Now you can track multiple traffic sources with one LeadOutcome lead capture form.

It Didn’t Work, Some Things to Try

If your copy paste foo was weak or I just didn’t do a good job of explaining it or if something else went wrong that I didn’t even think of you will need to figure out how to see why this isn’t working.  That or drop me an email.  Please try these things first before emailing me.

    1. Start all over again, seriously, You may have messed up the code somehow in the copy and paste process and inadvertently overwritten some other part of code.
    2. Un hide the LeadSource field.  Fine the piece of code shown bellow.  You are looking for the leadCapture_leadsource field.  Change the input type from hidden to text and save the form.

LO Form Code 3When you load the page, the ref value should show in a field above the ones you created for the form.  You can see what the code is pulling without submitting the form.  This is a screenshot bellow shows the field now not hidden with what the code read.

Use Pretty Link to Pass Parameters to LeadOutcome Lead Capture Forms 2

Still not working? Not sure as I’ve only been using this for a little while.  I recently did a webinar for LeadOutcome on this same method so I will put up the link to the webinar recording bellow once it is available.

Track multiple Traffic Sources with One LeadOutcome Lead Capture Form – Conclusion

With some quick code you can quickly track multiple traffic sources with one LeadOutcome lead capture form so they do double duty.  If you are not familiar with LeadOutcome, please check out my multi-part series which gives you an introduction on LeadOutcome.

Also, check our our bonus tip using Pretty Link blog article.

Leave A Comment