Our JavaScript (JS) Object connector returns real time firmographic information about your website visitors. You can use this information to personalise your website, giving your users a unique experience every time. This firmographic data includes company name, domain, industry, employee count and many other data points.
The JavaScript Object connector matches the website visitor’s IP address to the relevant Leadfeeder company profile. It then populates the JavaScript variable “discover” with firmographic information about the visitor.
You can use the JS Object connector alongside any other website personalisation tools.
Follow this short guide to set up the JS Object connector, see how to use it to pre-fill forms, and start personalising your website today!
STEP 1: In order to get started you must first have either a JS Object Connector subscription, or a free trial.
In the Dealfront lobby, either scroll down to 'Connectors' or click here while logged in, to go directly to our Connectors page.
You should see the JavaScript Object connector marked as Active. If not, please get in touch with your CSM, Account Manager or the Support team to enquire about starting a trial, or if you think you should have an Active subscription.
STEP 2: When you click through to the JS Object connector with an Active subscription you will see the following screen. Within this dashboard you can define which Target URLs (or domains) you want the connector to provide personalisation on. You must have the Leadfeeder Tracker installed on each of the domains or pages you input here.
In this example, we are setting up the connector on the youintechnology.com test website.
STEP 3: When you have an Active Dealfront JS Object connector and you have installed the Leadfeeder Tracker script on the Target URLs, the JS Object connector script will be automatically loaded.
You can first of all test this by visiting your website (one of the Target URLs) and opening the developer console. Then type "discover.meta.status", hit enter and you should see a 200 response.
Please note: If your IP address is not identified as belonging to an organisation, for example you are using home internet without a VPN, you will see a 404 status.
To see the firmographic information available via the JS Object connector in the developer console, type “window.discover.data" and hit enter.
For this example we are using demo parameters as if we were visiting the test website from Amazon. You can find these test parameters below to use for yourself if you're not connected to a company IP address.
STEP 4: When you have completed your testing you now need to apply the script to the areas of your website where you would like the personalisation to appear. The easiest way, and our recommended way, to do this is using Google Tag Manager (GTM). This is the best way if you have limited coding knowledge, or use a CMS where the code is subject to change with frequent updates.
GTM is a tool that makes adding scripts to your website simple, you can learn more about tag manager and how to use it here.
We'll use the simple example that you have a contact form and would like certain fields to be pre-filled when identifiable website visitors land on this page. Your end goal would look something like the below:
You can check if you have GTM on your site by using, for example, the Google Tag Assistant on Chrome.
With the Google Tag Assistant you can also check which GTM container you have on the site. The JS Object connector script needs to be added to the container that is present on your site.
STEP 5: Open the Container you wish to use. First you'll need to create a new Trigger. Select Triggers from the left hand menu and then New.
Name your trigger, we suggest 'discover.loaded' for ease.
Click into the box where it says 'Choose a trigger type to begin setup...' then scroll down and click the trigger type Custom Event.
Type in the event name. This must be written as 'discover.loaded' exactly because it must match up with the 'Emitted event name' in the Dealfront JavaScript Object connector settings. Click Save.
STEP 6: Now you've made your trigger we have to make the tag. Select Tags from the left hand menu and then New.
Name your tag, we suggest something like 'Dealfront - Add Company Info to Contact Form' for ease.
Click into the box where it says 'Choose a tag type to begin setup...' then scroll down and click the trigger type Custom HTML.
Paste in the script which will identify where you want the firmographic data to appear. You don't need to touch Advanced Settings.
The script we have used is below. There are two field examples here:
The first is looking for a textarea in the form with the ID of wpforms-294-field_3. When it finds this field, and there is a status code of 200 to indicate the visit comes from an identified IP address, it will return the data we specify into that field. In this case the company name.
The second is looking for the field ID of wpforms-294-field_4 to return the company industry.
<script>
textarea = document.querySelector("#wpforms-294-field_3")
if (textarea && discover && discover.meta.status === 200) {
textarea.value = discover.data.company.name
};
textarea = document.querySelector("#wpforms-294-field_4")
if (textarea && discover && discover.meta.status === 200) {
textarea.value = discover.data.company.industries.name
</script>
Now scroll down to apply the 'discover.loaded' trigger we just created to make this tag fire.
You will see the Custom Event for 'discover.loaded' in the list. Click to apply it and then hit Save.
STEP 7: Last but by no means least you must Submit and Publish your Container, this will push the new Tag and Trigger live to your website.
Back in your Workspace overview under Tags you will see your new Tag with its Trigger. Click Submit.
You will then be taken to a screen to Publish your changes. Click Publish.
Google Tag Manager then invites you to add a description of the changes you've just made. This is a housekeeping practice and entirely optional. Choose whether to Skip, or enter some details and Continue.
Congratulations! Your changes should now be live!
Please note: If you don't have publishing rights in Google Tag Manager, you will need to check in with your GTM admin user to enable the changes to be put live.
STEP 8: To test, visit the page where you expect to see the personalisation. Ensure you're either using our test parameters provided, or are visiting from a company IP address. You should now see the fields you set automatically populate with visiting company data.
The above is only a simple example to get you started. By using the same process you can create many different personalisations. The sky's the limit on what can be achieved!
Please Note: Data received from JS Object Connector might occasionally differ from data received in your Dealfront Web Application as they come from different databases so we do not recommend comparing those two.
Test Parameters
We have provided some test parameters you can use which are attached to the following industries. Simply add the parameter to the end of your website URL to make it look like the visit is coming from a certain industry:
For industry Internet use: ?_lf_discover_demo=amazon
For industry Banking use: ?_lf_discover_demo=goldmansachs
For industry Insurance use: ?_lf_discover_demo=lemonade
Please test this in an incognito window as your website might be cached and keep showing a 404 error.
Please note: We no longer recommend Google Optimise because Google have discontinued (sunset) this tool and no longer maintain it.
--
Questions, comments, feedback? Please let us know by contacting our support team via the chat or by sending us an email at support@dealfront.com.
RELATED: