Website Personalization API

Personalize your website for your target accounts

26 views March 15, 2017 developer 0

Our customers and partners leverage the Account-Based Website Personalization API to personalize the website experience for anonymous visitors and first-time visitors. Crafting the right message to the right account on the website doubles conversion rates and website engagement.

Most of our customers personalize the experience for their most important accounts, tailoring the content based on: company visitor size, company visitor industry, company visitor target account.

How it works

The Azalead 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

Before using the Azalead Website Personalization API you will need to open an Azalead 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 Azalead 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 Azalead tag is on your website, you will be able to capture the visiting company data to personalize content anywhere in the <body> of your website pages. 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 personalize your content.

Here is a sample of website personalization Company data in the Azalead tag

var aza_company_visitor = '{ "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" }';
if (/(MSIE|Trident\/|Edge\/)/i.test(navigator.userAgent)) {
    var e = document.createEvent("Event");
    e.initEvent("azaCompanyVisitorLoaded", !0, !0), document.dispatchEvent(e)
} else document.dispatchEvent(new Event("azaCompanyVisitorLoaded"));

 

Let’s try it

After placing the Azalead tag on your website you can try one or a combination of the 3 example use cases below: company visitor size, company visitor industry, company visitor target account.

 

Case 1 – Company size personalization

Display different content depending on visiting company size.

 

 

Code samples

Javascript

<html>
   <head>
      <title>Azalead Company Visitor Company Size Sample</title>
      <style>
body {
       font-family: Calibri,Helvetica,Arial,sans-serif;
       margin: 20px;
}
#message{
  background-color: #f7ce46;
  color: #FFFFFF;
  font-size: 14px;
  text-align: center;
  padding: 10px;
  width: 200px;
  margin: 20px 0px;
}
      </style>
   </head> 
   <body>


<!-- Step 1: Hide the component(s) you want to display for personalization -->    
      <div id="message" style="visibility:hidden;">Company Visitor</div>

<!-- Step 2: Listen to azaCompanyVisitorLoaded event 
      and adapt your content to company visitor -->
      <script type="text/javascript">
document.addEventListener('azaCompanyVisitorLoaded', function (e) {
  // get Azalead company visitor data
  if (typeof aza_company_visitor !== "undefined") {
    var yourCompanyVisitor = JSON.parse(aza_company_visitor);
    
    // change message within number of employees
    if (yourCompanyVisitor != null && yourCompanyVisitor.employee != null) {
      if (yourCompanyVisitor.employee > 100) {
        document.getElementById("message").innerHTML = 
          'ENTERPRISE COMPANIES<br/>Connected to global consumers';
      } else {
        document.getElementById("message").innerHTML = 
          'MID MARKET<br/>Offers adapted to your business';
      }
    }
  } 
}, false);
      </script> 
      <!-- script to remove and to replace with your Azalead Tag -->
      <!-- aza_company_visitor mock object for tests -->
      <script src="http://images.azalead.com/developer/js/aza_website_visitor.js"></script>
      <!-- script to remove and to replace with your Azalead Tag -->

<!-- Step 3: Show the personalized content -->
<script type="text/javascript">
// This script avoids blinking effect on display
window.onload = function () { 
  document.getElementById("message").style.visibility = 'visible';
}
</script>
   </body>
</html>

Jquery

<html>
   <head>
      <title>Azalead Company Visitor Company Size Sample</title>
      <style>
body {
       font-family: Calibri,Helvetica,Arial,sans-serif;
       margin: 20px;
}
#message{
  background-color: #f7ce46;
  color: #FFFFFF;
  font-size: 14px;
  text-align: center;
  padding: 10px;
  width: 200px;
  margin: 20px 0px;
}
      </style>
      <script type="text/javascript" 
         src="http://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
   </head>
   <body>


<!-- Step 1: Hide the component(s) you want to display for personalization -->
      <div id="message" style="visibility:hidden;">Company Visitor</div>

<!-- Step 2: Listen to azaCompanyVisitorLoaded event 
      and adapt your content to company visitor -->
      <script type="text/javascript">
$(document).on('azaCompanyVisitorLoaded', function(){
    // get Azalead company visitor data
    if (typeof aza_company_visitor !== "undefined") {
      var yourCompanyVisitor = $.parseJSON(aza_company_visitor);

      // change message within number of employees
      if (yourCompanyVisitor != null && yourCompanyVisitor.employee != null) {
        if (yourCompanyVisitor.employee > 100) {
          $("#message").html('ENTERPRISE COMPANIES<br/>Connected to global consumers');
        } else {
          $("#message").html('MID MARKET<br/>Offers adapted to your business');
        }
      }
    } 
});
      </script> 
      <!-- script to remove and to replace with your Azalead Tag -->
      <!-- aza_company_visitor mock object for tests -->
      <script src="http://images.azalead.com/developer/js/aza_website_visitor.js"></script>
      <!-- script to remove and to replace with your Azalead Tag -->


<!-- Step 3: Show the personalized content -->
<script type="text/javascript">
// This script avoids blinking effect on display
window.onload = function () { 
  $("#message").css('visibility', 'visible');
}
</script>  
   </body>
</html>

Case 2 – Company visitor industry personalization

Display different contents depending on visiting company industry vertical.

Azalead industry list

Advertising & Marketing Environmental Services Media & Publishing
Agriculture, Forestry and Fishing Food & Beverages Non-Profit Organization Management
Apparel & Fashion Government Services Oil & Gas
Automotive Hardware & Equipment Pharmaceuticals & Biotechnology
Banking & Financial Services Health Care Publishing
Business Services Home Equipment & Furnishings Real Estate
Chemicals Hospitality & Restaurants Retail
Construction Human Resources Software & Services
Consulting & Professional Services Insurance Telecommunications
Education Legal & Accounting Services Transportation & Logistics
Electronics Leisure & Entertainment Travel & Tourism
Energy Manufacturing

 

Code samples

Javascript

<html>
   <head>
      <title>Azalead Company Visitor Industry Sample</title>
      <style>
body {
       font-family: Calibri,Helvetica,Arial,sans-serif;
       margin: 20px;
}
#message{
  background-color: #f7ce46;
  color: #FFFFFF;
  font-size: 14px;
  text-align: center;
  padding: 10px;
  width: 200px;
  margin: 20px 0px;
}
      </style>
   </head> 
   <body>

<!-- Step 1: Hide the component(s) you want to display for personalization -->
      <div id="message" style="visibility:hidden;">NEW ERA OF INNOVATION<br/>State of the art</div>

<!-- Step 2: Listen to azaCompanyVisitorLoaded event 
      and adapt your content to company visitor -->
      <script type="text/javascript">
document.addEventListener('azaCompanyVisitorLoaded', function (e) {
  // get Azalead company visitor data
  if (typeof aza_company_visitor !== "undefined") {
    var yourCompanyVisitor = JSON.parse(aza_company_visitor);

    // change message within company industry
    if (yourCompanyVisitor != null && yourCompanyVisitor.industry != null) {
      if (yourCompanyVisitor.industry === 'Retail') {
        document.getElementById("message").innerHTML = 
          'RETAIL ADVANTAGES<br/>Meeting high volume demands';
     } else if (yourCompanyVisitor.industry === 'Publishing') {
        document.getElementById("message").innerHTML = 
            'REALTIME PUBLISHING<br/>Adapt to your business';
     }  else if (yourCompanyVisitor.industry === 'Banking & Financial Services') {
        document.getElementById("message").innerHTML = 
            'FINANCIAL MANAGEMENT<br/>Data for your investments';
     } else if (yourCompanyVisitor.industry === 'Oil & Gas') {
        document.getElementById("message").innerHTML = 
            'OIL AND GAS<br/>Data for your analysis';
     }
    }
  } 
}, false);
      </script> 
      <!-- script to remove and to replace with your Azalead Tag -->
      <!-- aza_company_visitor mock object for tests -->
      <script src="http://images.azalead.com/developer/js/aza_website_visitor.js"></script>
      <!-- script to remove and to replace with your Azalead Tag -->

<!-- Step 3: Show the personalized content -->
<script type="text/javascript">
// This script avoids blinking effect on display 
window.onload = function () { 
  document.getElementById("message").style.visibility = 'visible';
}
</script>
   </body>
</html>

Jquery

<html>
   <head>
      <title>Azalead Company Visitor Industry Sample</title>
      <style>
body {
       font-family: Calibri,Helvetica,Arial,sans-serif;
       margin: 20px;
}
#message{
  background-color: #f7ce46;
  color: #FFFFFF;
  font-size: 14px;
  text-align: center;
  padding: 10px;
  width: 200px;
  margin: 20px 0px;
}
      </style>
      <script type="text/javascript" 
         src="http://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
   </head>
   <body>

<!-- Step 1: Hide the component(s) you want to display for personalization -->    
      <div id="message" style="visibility:hidden;">Company Visitor</div>

<!-- Step 2: Listen to azaCompanyVisitorLoaded event 
      and adapt your content to company visitor -->
      <script type="text/javascript">
$(document).on('azaCompanyVisitorLoaded', function(){
    // get Azalead company visitor data
    if (typeof aza_company_visitor !== "undefined") {
      var yourCompanyVisitor = $.parseJSON(aza_company_visitor);

      // change message within company industry
      if (yourCompanyVisitor != null && yourCompanyVisitor.naceCode != null) {
        if (yourCompanyVisitor.industry === 'Retail') {
            $("#message").html('RETAIL ADVANTAGES<br/>Meeting high volume demands');
        } else if (yourCompanyVisitor.industry === 'Publishing') {
            $("#message").html('REALTIME PUBLISHING<br/>Adapt to your business');
        }  else if (yourCompanyVisitor.industry === 'Banking & Financial Services') {
            $("#message").html('FINANCIAL MANAGEMENT<br/>Data for your investments');
        } else if (yourCompanyVisitor.industry === 'Oil & Gas') {
            $("#message").html('OIL AND GAS<br/>Data for your analysis');
        }  else {
            $("#message").html('NEW ERA OF INNOVATION<br/>State of the art');
        }
      }
    } 
});
      </script>   
      
      <!-- script to remove and to replace with your Azalead Tag -->
      <!-- aza_company_visitor mock object for tests -->
      <script src="http://images.azalead.com/developer/js/aza_website_visitor.js"></script>
      <!-- script to remove and to replace with your Azalead Tag -->

<!-- Step 3: Show the personalized content -->
<script type="text/javascript">
// This script avoids blinking effect on display 
window.onload = function () { 
  $("#message").css('visibility', 'visible');
}
</script>
   </body>
</html>

If you need to target a very specific industry using nace code is a great option.
» Get the full NACE code list.

Code samples

Javascript

<html>
   <head>
      <title>Azalead Company Visitor Industry Sample</title>
      <style>
body {
       font-family: Calibri,Helvetica,Arial,sans-serif;
       margin: 20px;
}
#message{
  background-color: #f7ce46;
  color: #FFFFFF;
  font-size: 14px;
  text-align: center;
  padding: 10px;
  width: 200px;
  margin: 20px 0px;
}
      </style>
   </head> 
   <body>

<!-- Step 1: Hide the component(s) you want to display for personalization -->
      <div id="message" style="visibility:hidden;">NEW ERA OF INNOVATION<br/>State of the art</div>

<!-- Step 2: Listen to azaCompanyVisitorLoaded event 
      and adapt your content to company visitor -->
      <script type="text/javascript">
document.addEventListener('azaCompanyVisitorLoaded', function (e) {
  // get Azalead company visitor data
  if (typeof aza_company_visitor !== "undefined") {
    var yourCompanyVisitor = JSON.parse(aza_company_visitor);

    // change message within company NACE code
    if (yourCompanyVisitor != null && yourCompanyVisitor.naceCode != null) {
      if (yourCompanyVisitor.naceCode.indexOf("47") == 0) {
        // 47 - Retail trade, except of motor vehicles and motorcycles
        document.getElementById("message").innerHTML = 
          'RETAIL ADVANTAGES<br/>Meeting high volume demands';
     } else if (yourCompanyVisitor.naceCode.indexOf("58") == 0) {
      // 58 - Publishing activities
      document.getElementById("message").innerHTML = 
            'REALTIME PUBLISHING<br/>Adapt to your business';
     }  else if ((yourCompanyVisitor.naceCode.indexOf("64") == 0) || (yourCompanyVisitor.naceCode.indexOf("66") == 0)) {
      // 64 - Financial service activities, except insurance and pension funding
      // 66 - Activities auxiliary to financial services and insurance activities
      document.getElementById("message").innerHTML = 
            'FINANCIAL MANAGEMENT<br/>Data for your investments';
     } else if (yourCompanyVisitor.naceCode === "0610") {
      // 0610 - Extraction of crude petroleum
      document.getElementById("message").innerHTML = 
            'OIL AND GAS<br/>Data for your analysis';
     }
    }
  } 
}, false);
      </script> 
      <!-- script to remove and to replace with your Azalead Tag -->
      <!-- aza_company_visitor mock object for tests -->
      <script src="http://images.azalead.com/developer/js/aza_website_visitor.js"></script>
      <!-- script to remove and to replace with your Azalead Tag -->

<!-- Step 3: Show the personalized content -->
<script type="text/javascript">
// This script avoids blinking effect on display 
window.onload = function () { 
  document.getElementById("message").style.visibility = 'visible';
}
</script>
   </body>
</html>

Jquery

<html>
   <head>
      <title>Azalead Company Visitor Industry Sample</title>
      <style>
body {
       font-family: Calibri,Helvetica,Arial,sans-serif;
       margin: 20px;
}
#message{
  background-color: #f7ce46;
  color: #FFFFFF;
  font-size: 14px;
  text-align: center;
  padding: 10px;
  width: 200px;
  margin: 20px 0px;
}
      </style>
      <script type="text/javascript" 
         src="http://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
   </head>
   <body>

<!-- Step 1: Hide the component(s) you want to display for personalization -->    
      <div id="message" style="visibility:hidden;">Company Visitor</div>

<!-- Step 2: Listen to azaCompanyVisitorLoaded event 
      and adapt your content to company visitor -->
      <script type="text/javascript">
$(document).on('azaCompanyVisitorLoaded', function(){
    // get Azalead company visitor data
    if (typeof aza_company_visitor !== "undefined") {
      var yourCompanyVisitor = $.parseJSON(aza_company_visitor);

      // change message within company NACE code
      if (yourCompanyVisitor != null && yourCompanyVisitor.naceCode != null) {
        if (yourCompanyVisitor.naceCode.indexOf("47") == 0) {
            // 47 - Retail trade, except of motor vehicles and motorcycles
            $("#message").html('RETAIL ADVANTAGES<br/>Meeting high volume demands');
        } else if (yourCompanyVisitor.naceCode.indexOf("58") == 0) {
            // 58 - Publishing activities
            $("#message").html('REALTIME PUBLISHING<br/>Adapt to your business');
        }  else if ((yourCompanyVisitor.naceCode.indexOf("64") == 0) 
                || (yourCompanyVisitor.naceCode.indexOf("66") == 0)) {
            // 64 - Financial service activities, except insurance and pension funding
            // 66 - Activities auxiliary to financial services and insurance activities
            $("#message").html('FINANCIAL MANAGEMENT<br/>Data for your investments');
        } else if (yourCompanyVisitor.naceCode === "0610") {
            // 0610 - Extraction of crude petroleum
            $("#message").html('OIL AND GAS<br/>Data for your analysis');
        }  else {
            $("#message").html('NEW ERA OF INNOVATION<br/>State of the art');
        }
      }
    } 
});
      </script>   
      
      <!-- script to remove and to replace with your Azalead Tag -->
      <!-- aza_company_visitor mock object for tests -->
      <script src="http://images.azalead.com/developer/js/aza_website_visitor.js"></script>
      <!-- script to remove and to replace with your Azalead Tag -->

<!-- Step 3: Show the personalized content -->
<script type="text/javascript">
// This script avoids blinking effect on display 
window.onload = function () { 
  $("#message").css('visibility', 'visible');
}
</script>
   </body>
</html>

 

Case 3 – Company visitor name personalization

Target a specific company visitor using its national id or website and personalize your welcome messages.

Code samples

Javascript

<html>
   <head>
      <title>Azalead Company Visitor Company Name Sample</title>
      <style>
body {
       font-family: Calibri,Helvetica,Arial,sans-serif;
       margin: 20px;
}
#companyvisitorname{
  background-color: #f7ce46;
  color: #FFFFFF;
  font-size: 14px;
  text-align: center;
  padding: 10px;
  width: 200px;
  margin: 20px 0px;
}
      </style>
   </head> 
   <body>

<!-- Step 1: Hide the component(s) you want to display for personalization -->
      <div id="companyvisitorname" style="visibility:hidden;">Company Visitor</div>

<!-- Step 2: Listen to azaCompanyVisitorLoaded event 
      and adapt your content to company visitor -->
      <script type="text/javascript">
document.addEventListener('azaCompanyVisitorLoaded', function (e) {
  // get Azalead company visitor data
  if (typeof aza_company_visitor !== "undefined") {
    var yourCompanyVisitor = JSON.parse(aza_company_visitor);
    
    // company visitor national ID
    if (yourCompanyVisitor != null && yourCompanyVisitor.nationalId != null
        && yourCompanyVisitor.nationalId === '542051180') {
      document.getElementById("companyvisitorname").innerHTML = 
        yourCompanyVisitor.companyName + '<br/>join our breakfast<br/>next Thusday';
    }
  } 
}, false);
      </script> 
      <!-- script to remove and to replace with your Azalead Tag -->
      <!-- aza_company_visitor mock object for tests -->
      <script src="http://images.azalead.com/developer/js/aza_website_visitor.js"></script>
      <!-- script to remove and to replace with your Azalead Tag -->

<!-- Step 3: Show the personalized content -->
<script type="text/javascript">
// This script avoids blinking effect on display 
window.onload = function () { 
  document.getElementById("companyvisitorname").style.visibility = 'visible';
}
</script>
   </body>
</html>   

Jquery

<html>
   <head>
      <title>Azalead Company Visitor Company Name Sample</title>
      <style>
body {
       font-family: Calibri,Helvetica,Arial,sans-serif;
       margin: 20px;
}
#companyvisitorname{
  background-color: #f7ce46;
  color: #FFFFFF;
  font-size: 14px;
  text-align: center;
  padding: 10px;
  width: 200px;
  margin: 20px 0px;
}
      </style>
      <script type="text/javascript" 
         src="http://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script> 
   </head>
   <body>

<!-- Step 1: Hide the component(s) you want to display for personalization -->
      <div id="companyvisitorname" style="visibility:hidden;">Company Visitor</div>

<!-- Step 2: Listen to azaCompanyVisitorLoaded event 
      and adapt your content to company visitor -->
      <script type="text/javascript">
$(document).on('azaCompanyVisitorLoaded', function(){
    // get Azalead company visitor data
    if (typeof aza_company_visitor !== "undefined") {
      var yourCompanyVisitor = $.parseJSON(aza_company_visitor);
      // company visitor national ID
      if (yourCompanyVisitor != null && yourCompanyVisitor.nationalId != null
          && yourCompanyVisitor.nationalId === '542051180') {
        $("#companyvisitorname").html(yourCompanyVisitor.companyName + '<br/>join our breakfast<br/>next Thusday');
      }
    } 
});
      </script>
      <!-- script to remove and to replace with your Azalead Tag -->
      <!-- aza_company_visitor mock object for tests -->
      <script src="http://images.azalead.com/developer/js/aza_website_visitor.js"></script>
      <!-- script to remove and to replace with your Azalead Tag -->


<!-- Step 3: Show the personalized content -->
<script type="text/javascript">
// This script avoids blinking effect on display 
window.onload = function () { 
  $("#companyvisitorname").css('visibility', 'visible');
}
</script>
   </body>
</html>

 

Was this helpful?