Installation

Add the Hacktionbase SDK to your website.

Script tag (recommended)

Add the SDK script to your HTML. It loads asynchronously and won’t block page rendering.

<script>
  (function(w, d, s) {
    var js = d.createElement(s);
    js.src = 'https://sdk.hacktionbase.com/hacktionbase.js';
    js.async = 1;
    js.onload = function() {
      Hacktionbase.init({
        sdkKey: 'YOUR_SDK_KEY',
        tenant: 'YOUR_TENANT_SLUG'
      });
    };
    d.head.appendChild(js);
  })(window, document, 'script');
</script>

The SDK is distributed as a single IIFE bundle — no npm package or build step required.

Configuration options

The init method accepts a configuration object:

Parameter	Type	Required	Default	Description
sdkKey	string	Yes	—	Your SDK key from the dashboard
tenant	string	Yes	—	Your tenant slug (subdomain)
position	'bottom-right' | 'bottom-left'	No	'bottom-right'	Widget bubble position
offset	{ x: number, y: number }	No	{ x: 20, y: 20 }	Pixel offset from the corner
hidden	boolean	No	false	Start with the widget bubble hidden
environment	'prod' | 'staging'	No	'prod'	Environment tag for events

What happens on init

1. The SDK fetches your widget configuration from the API
2. A chat bubble is rendered in the corner of the page
3. An iframe is created (hidden) to host the widget UI
4. Automatic page view tracking starts
5. Session replay starts in buffer mode (if enabled in your settings)

If the SDK key is invalid or the API is unreachable, the widget will not mount and a warning is logged to the console.

Single Page Applications

The SDK automatically tracks page navigations in SPAs by intercepting pushState and replaceState. No additional configuration is needed for React, Vue, Angular, or other SPA frameworks.