Widget Configuration

Customize the widget appearance and behavior from the dashboard.

Dashboard settings

Widget configuration is managed from the dashboard under Settings → Widget. Changes are fetched by the SDK on initialization — no code changes required.

Appearance

Setting	Type	Description
primaryColor	string	Main brand color (hex). Used for buttons, links, bubble background.
position	'bottom-right' | 'bottom-left'	Corner where the bubble appears.
borderRadius	string	Border radius for the widget panel.
fontFamily	string	Font family for widget text.
headerGradient	{ from, to }	Gradient colors for the widget header.

Behavior

Setting	Type	Description
welcomeMessage	string	Greeting text shown in the widget home view.
autoOpen	boolean	Automatically open the panel on first visit.
showOnMobile	boolean	Show the widget on mobile devices.

Features

Setting	Type	Description
sessionReplay	boolean	Enable session replay recording.
fileUpload	boolean	Allow users to upload files in conversations.
aiAssistant	boolean	Enable AI-powered responses.

SDK overrides

Some settings can be overridden via the SDK init config:

Hacktionbase.init({
  sdkKey: 'sk_live_abc123',
  tenant: 'acme',
  position: 'bottom-left',  // Overrides dashboard setting
  offset: { x: 16, y: 16 }, // Custom offset
  hidden: true               // Start hidden
});

The position from the SDK config takes precedence if the dashboard hasn’t set one. The dashboard’s position setting takes priority when configured.

Live preview

The dashboard includes a live widget preview that updates as you change settings. It uses a separate postMessage protocol (hacktionbase:preview_config) to send configuration changes to the preview iframe in real time.