Marketing Automation Integration

Pardot Personalized Landing Pages

120 views March 15, 2017 April 25, 2018 developer 0

Customize Pardot landing pages with Website Personalisation API to increase website engagement, conversion rates and overall marketing ROI. Website Personalisation API is powered by Jabmo Account Sensing and will personalize your landing page even for unregistered and anonymous visitors.

Adapt the offer and content on landing pages to engage target accounts more effectively. Providing timely, adapted content to deals in your pipeline will help accelerate sales.

How it works

The Jabmo website tag provides a JSON string. This string describes the name and firmographics of your company visitors. It contains several company data fields including:

  • Company Name
  • National ID
  • NACE code
  • Size
  • Legal Form
  • Industry
  • Employees
  • Website
  • City
  • Country
  • Country code
  • Zip Code

What does this variable look like?

{
    "companyName": "TOTAL S.A.",
    "nationalId": "542051180",
    "naceCode": "0610",
    "size": "Very large company",
    "legalForm": "SA",
    "industry": "Oil & Gas",
    "employee": "100307",
    "website": "www.total.com",
    "city": "COURBEVOIE",
    "country": "France",
    "countryCode": "FR",
    "postCode": "92400" 
}

Getting website visitor data

To use Jabmo website tag you will need to open an Jabmo account. If you do not yet have an account, you can sign up here for a free trial account.

After opening an account, you will receive your unique Jabmo tracker code to paste on your website. Either place the tag at the end of the <body> section of your html pages or use one of our CMS plugins (WordPress, Joomla, Drupal).

Once the Jabmo tag is on your website, you will be able to capture the visiting company data to add content in Pardot Web forms. The process is straightforward. When the variable is loaded, the tag fires a javascript event "azaCompanyVisitorLoaded". So you just need to listen to the "azaCompanyVisitorLoaded" event. When this event is fired you can access the "aza_company_visitor" variable and get the Company details you need to prefill your forms.

You're all set to start the 3 steps Pardot landing page personalization.

Create a Pardot B2B personalized landing page

Step 1 - Choose your segments

Display different content depending on visiting company industry vertical. We recommend to start with one or two industries.

> Download Jabmo industry list

 

 

Step 2 - Design your landing page

Here's a code sample that include one image, a title and a decription. Add "id" and "style" tags just like in the code bellow so that you can inject personalized data. This way you can craft the right message to the right audience.

Code sample

HTML code sample

<div class="personalization-content">
   <div class="primary-img">
    <img id="aza-wp-lp-image" style="visibility: hidden;" src="http://www.yourdomain.com/default-image.png" pardot-region="pardot_image" pardot-region-type="image" alt="" height="" width="">
   </div>
   <div class="text-content">
      <h2 id="aza-wp-lp-title" style="visibility: hidden;" pardot-region="pardot_simple">Discuss solutions with an expert</h2>
      <div id="aza-wp-lp-description" style="visibility: hidden;"  pardot-region="pardot_content" data-id="942">
         <p>Acme offers affordable solutions and services that can help your company. Learn how Acme services can increase your ROI.</p>
      </div>
   </div>
</div>

Step 3 - Add personalization code

This javascript code sample remplaces the 3 elements listed bellow (image, title and description) with the right message for "Banking & Financial Services" industry. You can easily adapt it to your user case. Just copy/paste this sample before </body> tag. Don't forget to remplace Jabmo tracking code.

Code sample

Javascript code sample

<script type="text/javascript">
// put your own text and image url here
var imgBank = 'http://www.acme.com/banking_photo.png';
var titleBank = 'Discuss solutions for Banking with an expert';
var descriptionBank = 'Acme offers affordable solutions and services that can help Banking & Financial Services companies';

document.addEventListener('azaCompanyVisitorLoaded', function (e) {
  if (typeof aza_company_visitor !== "undefined") {
    var yourCompanyVisitor = JSON.parse(aza_company_visitor);
    if (yourCompanyVisitor != null && yourCompanyVisitor.industry != null
        && yourCompanyVisitor.industry === 'Banking & Financial Services') {
      document.getElementById("aza-wp-lp-title").innerHTML = titleBank;
      document.getElementById("aza-wp-lp-description").innerHTML = descriptionBank;
      document.getElementById("aza-wp-lp-image").src = imgBank;
    }
  } 
}, false);
</script> 
<!-- Put your Jabmo tracking code here --> 
<script src="http://images.jabmo.com/developer/js/aza_website_visitor.js" type="application/javascript"> </script> 
<!-- End Jabmo tracking code -->
<script type="text/javascript">
window.onload = function () { 
  document.getElementById("aza-wp-lp-subtitle").style.visibility = 'visible';
  document.getElementById("aza-wp-lp-description").style.visibility = 'visible';
  document.getElementById("aza-wp-lp-image").style.visibility = 'visible';
}
</script>

Your Pardot personalized landing page is now completed. Feel free to ask any question in developer forum

Was this helpful?