Quickstart - Bily developer docs

Select the intended store, then open Bily > Settings > Apps > More settings > Install tracking. Choose the technology for your site and copy the complete script or SDK snippet, including every query parameter and encoded character.

Choose one installation path

Use the raw script tag for plain HTML. Use @bilyai/js for JavaScript applications, React, and Next.js.

Plain HTML
Application SDK

Add the exact script tag once inside the global <head>.

index.html

<script
  src="https://tracking.example.com/b.js?shop=store.example.com"
  referrerpolicy="strict-origin-when-cross-origin"
></script>

Install the official package.

npm install @bilyai/js

Initialize it once from browser code.

analytics.ts

import { init } from "@bilyai/js";

init({
  scriptUrl: "https://tracking.example.com/b.js?shop=store.example.com",
});

Let Bily record the initial page view

The installed browser script records the first PageView automatically. Do not call track("PageView") during the initial mount.If your application changes routes without loading a new document, track each later route after the router commits it.

analytics.ts

import { track } from "@bilyai/js";

track("PageView", {
  sourceUrl: window.location.href,
  pageTitle: document.title,
});

Track an application event

Use stable snake_case names for your own application events.

analytics.ts

import { track } from "@bilyai/js";

track("workspace_created", {
  workspace_id: "workspace_456",
  user_id: "user_123",
});

Verify loading

SDK calls queue before loading finishes, so normal tracking does not need to wait. Use ready() only when you need an explicit load check.

verify-bily.ts

import { ready } from "@bilyai/js";

try {
  await ready();
  console.info("Bily is ready");
} catch (error) {
  console.error("Bily did not load", error);
}

​Framework guides

JavaScript

React

Next.js

Framework guides