Extended functionality

Customise the Age Gate dialog

It is possible to customise the Age Gate dialog with custom name and logo, to achieve that please use the following JavaScript trigger code:

<script type="text/javascript">
  ageGate.overrideName('MyCompanyName');
  ageGate.overrideLogo('https://www.mypage.com/companyLogo.png');
  ageGate.play();
</script>

Get current age

The age provided by the user is available to obtain with the following code (if you call it before the interaction with the dialog has finished then the method will return 0):

<script type="text/javascript">
  var providedAge = ageGate.getCurrentAge();
</script>

Add custom actions

You can also set custom actions/methods to be executed once a interaction is finished (the age provided by the user is available in the scope). To add methods to call please use the following code:

<script type="text/javascript">
  ageGate.process = function(age) {
    console.log('Provided age: ' + age);
    // Logic here ...
  }
  ageGate.play();
</script>

Examples

  1. Redirect the user to a safe page if the age is not suitable for the content.
<script type="text/javascript">
  ageGate.process = function(age) {
    console.log('Processed age: ' + age);
    if (age < 13) {
      window.location.href = "https://www.superawesome.tv/popjam";
    }
  }
  ageGate.play();
</script>
  1. Execute a method that hides inappropriate content.
<script type="text/javascript">
  function hideMyContent() {
    document.getElementById('blockX').style.display = "none";
  }
</script>

<script type="text/javascript">
  ageGate.process = function(age) {
    console.log('Processed age: ' + age);
    if (age < 10) {
      hideMyContent();
    }
  }
  ageGate.play();
</script>