Skip to main content

Custom Code- Partner Interface

Updated

Sometimes, companies want to integrate user-end technologies into their partner interface, such as a third-party live chat service. The Custom Code feature for the partner interface allows you to insert your own JavaScript or other code to make those integrations happen.

To use this feature, go to the Company > Customize Application > Admin / Advertiser / Partner Interface Design > Partner Interface Custom Code. Enter the desired code in the Custom Code field, then click Save.

Once saved, the partner interface will begin using that new footer code by inserting its contents directly before the closing </body> tag on the interface.

Using JavaScript

You can include JavaScript in this code. Because this inserts raw HTML directly into the page, you must enclose your Javascript in <script type=”text/javascript”> … </script>.

Javascript Libraries in Use: The partner interface uses AngularJS and jQuery libraries.

Important: The partner interface doesn’t reload pages when the user clicks on options. This means scripts implemented here won’t reload when your partners navigate to other interface parts.

Using a Third-Party Event Tracker

Those wanting to connect their partner interface to a third-party event tracker can do so by implementing the following code block:

<script type="text/javascript">
  publicEvent.on('routeChangeSuccess', function() {
    alert('Page Change Event');
    // Code to implement
  });
</script>

This code uses EventEmitter’s publicEvent object and AngularJS’s routeChangeSuccess event.

Retrieving Current User Information

The following code block shows how to get the current partner’s user information, such as their name and the account manager on file.

<script type="text/javascript">
  publicEvent.on('currentUserDataLoaded', function(data) {
    console.log('currentUserData', data);
    // Code to implement
  });
</script>

Once currentUserDataLoaded is emitted, the information is stored in an array called currentUserData:

{
  'Affiliate' : <name of affiliate's company>,
  'AffiliateUser' : <name of this user>,
  'Brand' : <name of your company>,
  'AccountManager' : <name of this user's account manager>
}

Additional data related to the current user can be accessed from window.CurrentUser after currentUserDataLoaded is emitted.

Using CSS

You can override the interface’s CSS classes with your specifications. Because this inserts raw HTML directly into the page, you must enclose your CSS in <style type=”text/css”> … </style>.

Warnings

Remember that the code you enter is directly inserted into the partner interface. The partner interface may become nonfunctional if your code is malformed or includes an error-prone script. Always test your changes by logging into the interface as a partner. Revise or remove your custom code if that happens.

This feature allows you to insert HTML into your interface so you can add JavaScript and other elements to it. However, if you use this to insert normal text, the text won’t appear correctly on the page due to where the code is placed in the HTML output.

Related articles