Update May 5 2014: fixed critical bug in prepop which caused the callback function to fail when the visitor has no cookie.
Update July 31, 2013: Critical update with two crucial bug fixes: fixed the script comments to give correct instructions for the theseFields array, and added a parameter visitorEmailField because apparently different instances of eloqua use different field names for the visitor data lookup email address. I also added a line to the instructions that shows how to set it up so that if the visitor is new (has no Eloqua cookie) and they fill in their email address, the whole script runs again, populates the form according to the new email address, and runs progressive profiling accordingly.
To find out what your visitorEmailField should be set to, you'll have to look at the data lookup scripts for the cookie data lookup and see what the field names are. It should be something like V_Email_Address or V_ElqEmailAddress.
Update July 25, 2013: I have posted a new version which fixes several critical bugs in the previous version. Please get the latest version below if you're still using any of the older versions.
Update July 19, 2013: this script has been updated to use the new Eloqua tracking scripts. I have added support for radio buttons and for using any field (not just the first field) for the email address. Also note that skip rules are now indexed by field name, not by number.
First post.
I'd like to share with you a script I call Progress Pro - a script that uses jquery and data lookups to implement advanced progressive profiling for Eloqua 10.
You can download the script here: http://www.kpaonline.com/assets/js/progressPro.zip
Progressive profiling is a technique whereby visitors are asked different questions each time they fill out a form. The idea is to start by asking a few simple questions, for example email address and name, and gradually learn more about the visitor as they perform subsequent registrations. This reduces the barrier to entry into your marketing campaign, while still allowing you to collect detailed information on your most interested prospects.
The Problem
Eloqua 10 has a cloud component for progressive profiling. If you want to implement progressive profiling on an Eloqua-hosted landing page, I suggest you start with that. See this post: http://topliners.eloqua.com/community/do_it/blog/2013/02/05/how-to-do-progressive-profiling-in-e10-using-the-cloud-component
However, this solution only works for forms hosted on Eloqua landing pages. It also has some limitations, although it is generally pretty good. But if you want to do progressive profiling on your own forms, you will need to implement some sort of custom solution.
The desired solution would work for visitors from any channel, use only one form, and enable advanced dynamic skip rules while still allowing easy implementation for simple use cases. It would dynamically pre-populate the form based on browser cookie or email address and ask questions conditionally according to the prospect's previous answers. Incidentally, it would also be useful to track the incoming channel and store it in a contact field. Progress Pro implements such a solution.
Methodology
Eloqua has an amazingly awesome feature called Data Lookups. I won't go into the details, as the feature is well documented. This feature allows you to access data from your Eloqua database using javascript. Once you have data on the visitor, you can use javascript to manipulate the form accordingly. The methodology is:
- Create a long form, beginning with email address, containing all of the questions you want to ask in the entire profiling process. Set the email address field to prefill, but don't make any of the fields required.
- Create two data lookups: one for looking up the email address by tracking cookie, and one for looking up the rest of your data by email address. These lookups are performed by Progress Pro using jquery.getScript to load a script with appropriate parameters from Eloqua.
- If the visitor comes in from an email, their email address will be prefilled. Progress Pro uses this to perform the lookup by email address and prefill the form with data accordingly.
- If the vistor comes from another channel and has an Eloqua tracking cookie, Progress Pro performs a data lookup by cookie to get the email address, then performs another lookup by email address to get the rest of the data and prefill the form.
- If neither of these is the case, the visitor will begin by filling in the email address field. Progress Pro attaches a jquery.change handler to the email field, and performs the lookup by email address once it has been filled in. If the visitor is not in the database, the rest of the form obviously stays empty.
- Progress Pro then hides some of the questions on the form according to parameters you specify. In the basic setup, you simply specify a number of fields at the top of the form that should always be shown, and the number of unanswered questions you want to ask. Each time the visitor returns, they will be asked a new set of unanswered questions until they have completed the entire form.
- For more advanced use cases, you can specify an array of conditional skip rules; e.g. if the prospect indicates interest in a particular product in the answer to one of the questions, skip all questions having to do with other products. These rules are implemented dynamically - as soon as the prospect selects an answer to the question on which the rule depends, the form immediately alters accordingly.
- Progress Pro uses jquery.validate to validate the form. This is necessary because only visible fields can be required, or the form will always fail validation. You specify an initial set of validation rules, which are modified dynamically according to which fields are shown.
- To track the incoming channel, you can use an optional URL parameter called "ch" - your form needs to contain an hidden field called "Channel History" which will be populated with whatever channel you specify in the URL.
Usage
To use this script, first upload it to your website (or wherever else you want to host it - please don't hotlink our copy of the script, if you do I will find out and ask you very politely to stop ). Then, in the <head> section of your landing page, add javascript code similar to the following:
//---------begin code-------------
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.0/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.8/jquery.validate.min.js"></script>
<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.8/additional-methods.js"></script>
<script type="text/javascript" src="http://www.mydomain.com/assets/js/progressPro.js"></script>
//-----------end code--------------
This is to load the necessary script files. Obviously replace "mydomain" with your domain, and replace "assets/js" with the path to your copy of Progress Pro.
You should also make sure you have installed the Eloqua visitor tracking code, which you can find in Eloqua under Setup->Website->Tracking.
Then you set up a document.ready function to call the function prePop and prepopulate the form. You will need to specify which field to use for the email address. As a callback from the prePop function, optionally call addChannel() to record the incoming channel in the Channel History field, and call the function progressiveProfile to hide fields as appropriate. Be sure to call the latter two functions as callbacks from prePop or they will not work.
In the most basic usage, just specify the number of unanswered questions to ask and the number of fixed questions to always show at the top. For this example we will set both to 3. A more advanced call using conditional skip rules is shown in the comments of the script itself. For basic usage, just specify the skip rules as an empty array.
You will need to provide the data lookup keys for your data lookup by cookie and by email. These will be generated by Eloqua when you set up the data lookups. You will also need to provide an array of form fields (indexed starting at 0) with the names of the database fields corresponding to each question. These names can be found in the fields setup in Eloqua. Also provide a set of jquery.validate validation rules (see http://docs.jquery.com/Plugins/validation). In this example, all fields are required.
//------------begin code--------------------------
<script type="text/javascript">
$(document).ready(function() {
var elqDLKey_Cookie = escape('9b4bd4bf329e4f5c886a84464823313d');
var elqDLKey_Email = escape('beecda0cb5e04cfa93fe68127cb5cdb0');
var theseFields = [C_EmailAddress', 'C_FirstName', 'C_LastName', 'C_How_did_you_hear_about_us_1',
'C_BusPhone', 'C_Title', 'C_Company', 'C_State_Prov', 'C_Product_Family1',
'C_Number_of_Employees1', 'C_HR_When1', 'C_EHS_when1', 'C_Channel_History11'];
var openQuestions = 3;
var fixedQuestions = 3;
var emailField = 'C_EmailAddress';
var visitorEmailField = 'V_ElqEmailAddress';
var thisForm = $('form').attr('id');
var myValidationRules = { rules: {firstName: {required: true}, lastName: {required: true},
howDidYouHearAboutUs: {required: true}, title: {required: true}, company: {required: true},
stateOrProvince: {required: true}, productFamily: {required: true},
numberOfEmployees: {required: true}, hRWhen: {required: true}, eHSWhen: {required: true},
businessPhone: { required: true, phoneUS: true }, emailAddress: { required: true, email: true } } };
var mySkipRules = {};
prePop(theseFields, elqDLKey_Cookie, elqDLKey_Email, emailField, visitorEmailField function(){
addChannel();
progressiveProfile(openQuestions, fixedQuestions, thisForm, theseFields, elqDLKey_Cookie,
elqDLKey_Email, emailField, myValidationRules, mySkipRules);
});
$('[name="'+emailField+'"]').change(function() {
prePop(theseFields, elqDLKey_Cookie, elqDLKey_Email, emailField, visitorEmailField, function(){
addChannel();
progressiveProfile(openQuestions, fixedQuestions, thisForm, theseFields, elqDLKey_Cookie,
elqDLKey_Email, emailField, myValidationRules, mySkipRules);
});
});
});
</script>
//--------------end code-------------
For advanced usage, the skip rules are specified as an array. You set which field (by name) is to be hidden or shown, the field value the rule depends on, an operator, and a condition to match the "depends" field against. In other words, the rule states something like "hide this field if this other field contains 'California'" or perhaps "show this field if this other field equals 'yes'". You can specify multiple skip rules for each field. As a simple example, suppose we want to hide field 'C_HR_When1' if field 'C_Product_Family1' has the value "yes." The skip rule for this looks like:
//---------begin code-----------
var mySkipRules = {'C_HR_When1': {1: {action: 'hide', depends: 'C_Product_Family1', operator: 'eq', condition: 'yes'}}};
/----------end code ---------------
The possible actions are "hide" and "show" where show takes priority over hide if the rules contradict. The possible operators are "eq" for equals, "neq" for not equal to, "contains" and "always" - always means the action will always be taken regardless of the values of other fields.
A more advanced example is given in the script comments.
Et voila! We have progressive profiling that works for all visitors, uses a single form, and supports both simple cases and more advanced conditional rules.
I hope you find this useful. If you have any questions, comments or problems with this, please don't hesitate to contact me: esnyder@kpaonline.com.
[EDITOR'S NOTE: As this is custom code, the Eloqua support team will not be able to provide support or help you troubleshoot this code if you implement it. We recommend that you take Eli up on his offer and add a comment to this message and/or email him directly if you run into questions.]