The #1 Humanized Marketing Platform

(Version 1.4) What is the integration process for the badge?



  • Smaller integration code

  • More flexible in customizing and extending Badge

  • Performance improvements by limiting the number of requests

  • Performance improvements by using a Content Delivery Network


This is the script that must be placed in the e-shop code to display the badge in any form/mode.

Important note: At the point where you would like to display the banner you should create an empty div with the selector you have set, e.g <div class="badge_holder"></div>


For the badge to work, it needs the following libraries already loaded:

  • e-satisfaction integration library
  • CryptoJS hmac-sha256 library
  • CryptoJS enc-base64 library


// Attach e-satisfaction badge
var f = document.createElement("script");
f.type = "text/javascript", f.src = "https://cdn.e-satisfaction.com/clients/badge/v1.4/badge.js";
var g = document.getElementsByTagName("script")[0];
g.parentNode.insertBefore(f, g);

// Setup esat global config
window.esat_config = { client_id: "YOUR_SITE_ID", public_key: "YOUR_PUBLIC_KEY", private_key: "YOUR_PRIVATE_KEY" }; // Setup badge configuration window.esat_badge_config = { mode: 'both', // Banner options banner: { holder: 'BANNER_HOLDER_CSS_SELECTOR' }, // Bar options bar: { holder: 'BAR_HOLDER_CSS_SELECTOR' } }


In order to allow the Badge to be shown, you have to define the Badge mode.

    • banner: Display the banner
    • bar: Display the bar on the top of the page
    • both: Display both banner and bar
    • lightbox: Display lightbox in embedded form
  • banner: The badge banner configuration:
    • holder: This is the holder (css selector) where the banner will be appended to.
  • bar: The badge bar configuration:
    • holder: This is the holder (css selector) where the bar will be appended to.

Was this article helpful?
0 out of 0 found this helpful

Have more questions? Submit a request