Kulka documentation

Next.js installation

Load the Kulka widget from a client component in a Next.js App Router project.

Current production method

Use next/script in a server layout or inject the loader from a client component. The example below requires no npm package.

tsxCopy-ready

import Script from "next/script";

export function KulkaChat() {
  return (
    <Script
      src="https://kulka-support-app-widget.vercel.app/v1/widget.js"
      data-kulka-widget
      data-organization-id={process.env.NEXT_PUBLIC_KULKA_ORGANIZATION_ID}
      data-agent-id={process.env.NEXT_PUBLIC_KULKA_AGENT_ID}
      strategy="afterInteractive"
    />
  );
}

Environment variables

The NEXT_PUBLIC prefix is expected because both identifiers are intentionally sent to the browser. Do not place private Kulka administration credentials in these variables.

bashCopy-ready

NEXT_PUBLIC_KULKA_ORGANIZATION_ID=YOUR_ORGANIZATION_ID
NEXT_PUBLIC_KULKA_AGENT_ID=YOUR_AGENT_ID