axite Documentation

Appearance

Integrate Insights ​

To track the impact of your content, you need to integrate the axite script into your website or shop and use it to send back events to the axite platform.

Setup ​

Add this javascript snippet to your web page and initialize it with your pipeline id and the content id of the content that's on that page.

html
<script>
  window.axite = window.axite || new Proxy({q: []}, { get: (t, p) => t[p] ? t[p] : (...a) => t.q.push([p, ...a]) });
  (function() {
    var script = document.createElement('script');
    script.src = 'https://impact.axite.app/axite.v1.js';
    script.async = true;
    document.head.appendChild(script)
  })();
  axite.init({
    pipeline: 'yourOrg/yourPipeline',
    contentId: '1234',
    trackUniqueViews: true
  });
  axite.logEvent('view');
</script>

Logging events ​

To send an event, call axite.logEvent(eventType, options).

logEvent() is designed to survive page navigation, so calling it as onclick handler of a link or submit button works fine.

See the API section for more details.

Tracking Unique Visitors/Views ​

Axite impact tracking does neither store (client or server side) nor send any data that can be used to identify individual users by default. However, you can enable tracking of unique views by setting trackUniqueViews: true in the axite.init() call. This will store visited content ids client side only and send back only the timestamp of the previous view to the server when the view event is sent. No user ids or other personal data is sent or stored on our servers. If you explicitly set trackUniqueViews: false, all existing data that is saved client side will be deleted.

Updating Config on the Fly ​

If you want to change the config after calling init, for example to enable trackUniqueViews after the user has approved tracking, you can call axite.init() again with the new config. The new config will be merged with the existing one.

js
axite.init({
  trackUniqueViews: true
});

Associating Events with Data and Configuration in axite ​

To better understand the impact of your content, link events to data in axite, and correlate changes in impact with changes in your pipeline, you should setup your script with additional parameters. Axite can and will track impact events if you don't provide these parameters, but you will not be able to see the impact of your content in the context of your pipeline.

TIP

We recommend setting contentId whenever possible.

Content ID ​

Each piece of content in axite has a unique content id, which can be used to track the data it was generated with and the type and way it was generated, like a ruleset or an LLM. Whenever possible, you should set the contentId parameter in the axite.init() call to get the best possible insights into the impact of your content.

js
axite.init({
  pipeline: 'yourOrg/yourPipeline',
  contentId: '1234'
});

Object UID ​

To match events to data in axite, you can set the dataPool and objectUid parameters in the axite.init() call.

js
axite.init({
  pipeline: 'yourOrg/yourPipeline',
  dataPool: 'yourDataPool',
  objectUid: 'yourObjectUid'
});

Autodetect Object UID ​

We can also try to autodetect the uid on the each page the script is loaded for easier integration. You still need to set the dataPool parameter in the axite.init() call, but with this approach the axite script tag integration is completely static.

js
axite.init({
  pipeline: 'yourOrg/yourPipeline',
  dataPool: 'yourDataPool'
});

Autodetect currently looks for structured data / json-ld of @type: Product and uses the sku property as the object uid. If you have a different structure, please let us know and we can add support for it.

Autodetect Language ​

If you don't set contentId, language will be autodetected from the page's language (<html lang> attribute). Most probably you will never need to set the language manually, but if you want to override the autodetected language, you can do so by setting the language parameter in the axite.init() call.

js
axite.init({
  pipeline: 'yourOrg/yourPipeline',
  dataPool: 'yourDataPool',
  objectUid: 'yourObjectUid',
  language: 'yourLanguage'
});

Complete Example ​

html
<!DOCTYPE html>
<html><head>
  <script>
    window.axite = window.axite || new Proxy({q: []}, { get: (t, p) => p == 'q' ? t.q : (...a) => t.q.push([p, ...a]) });
    (function() {
      var script = document.createElement('script');
      script.src = 'https://impact.axite.app/axite.v1.js';
      script.async = true;
      document.head.appendChild(script);
    })();
    axite.init({
      pipeline: 'yourOrg/yourPipeline',
      contentId: '1234',
      trackUniqueViews: true
    });
    axite.logEvent('view');
  </script>
</head><body>
  <form>
    <button onclick="axite.logEvent('conversion')">Add To Basket</button>
  </form>
</body></html>

API ​

axite.init(config) ​

Initializes the axite script with the given configuration.

ParameterDescription
config: Configconfiguration object
ts
type Config = {
  pipeline: string
  trackUniqueViews?: boolean // optional, default: false
  contentId?: string // takes precedence over dataPool and objectUid
  dataPool?: string
  // autodetectable
  objectUid?: string
  language?: string
  //
  params?: string[]
}

axite.logEvent(eventType, options) ​

Sends an event to the axite platform.

ParameterDescription
eventType: stringOne of 'view', 'conversion', 'return'
options? : {contentId: string} optionalKey contentId: provide or override content id on a per-call basis

Example ​

js
axite.logEvent('conversion');

axite.printDebug() ​

Print debug information to the console. Useful for debugging and testing the integration, especially when using the autodetect feature.

More to Come

Are you bundling your frontend and already use packages from npm? Let us know and we'll provide you with an axite npm package to simplify script loading!