Onsite Configurations

To configure the banner on your site, we provide the possibility of specifying the parameters per site where the script will be running.

To do this you should add a script previous to the declaration of the script provided in the main website declaring which parameters you wish to change.

Adding parameters

<script type="text/javascript">
  var illow = illow || {};
  illow.customization = {
      colors: {
          background: 'black', // Changes background color of the banner, could be written on hexa or the name of the color.
          buttonBackground: 'yellow', // Changes button color of the banner, could be written on hexa or the name of the color.
          font: 'white', // Changes font color of the banner, could be written on hexa or the name of the color.
      },
      settings: {
          positioning: 'squared', // Change how the banner is displayed, posibilities are: 'squared', 'top' or 'bottom'. Any other option will be ignored.
          lng: 'es', // Change the language of the banner, posibilites are: 'es' for spanish, 'pt' for portuguese or 'en' for english. Any other option will be ignored
          showCircledWidget: true, // Change if the circle widget will be displayed after the user has accepted your cookies.
          hideBanner : false //Change it if you want to hide the banner on your website, for example hideBanner : true
      },
  };
</script>
<script src="https://platform.illow.io/banner.js?siteId={yourSiteId}"></script>

tip

Do not change parameters that you are already happy with their state on the main site.

All of these parameters are optional, meaning that you can, and should, only modify the parameters that you wish to be altered. The parameters that were not altered will use the options of the main site.

Updating the banner after initial loading

In order to change the customization of the banner at runtime, we provide you with the method illow.refreshWidget() following the next snippet.

Updating customization after initial loading

// (...)
illow.customization = {
  colors: {
    background: 'black', // Changes background color of the banner, could be written on hexa or the name of the color.
    buttonBackground: 'yellow', // Changes button color of the banner, could be written on hexa or the name of the color.
    font: 'white', // Changes font color of the banner, could be written on hexa or the name of the color.
  },
  settings: {
    positioning: 'squaredLeft', // Change how the banner is displayed, posibilities are: 'squaredLeft',  'squaredRight', 'top' or 'bottom'. Any other option will be ignored.
    lng: 'es', // Change the language of the banner, posibilites are: 'es' for spanish, 'pt' for portuguese or 'en' for english. Any other option will be ignored
    showCircledWidget: true, // Change if the circle widget will be displayed after the user has accepted your cookies.
    hideBanner : false //Change it if you want to hide the banner on your website, for example hideBanner : true
  },
};
illow.refreshWidget();
// (...)

tip

You even can change a part of the customization as well. Don't you like the background color for your text? Then change only that!

Updating background color only

// (...)
illow.customization = {
  colors: {
    background: 'red',
  },
};
illow.refreshWidget();
// (...)