Install the tracker

To start collecting data, you add a small piece of code — the UMAP360 tracker (also called the Web SDK) — to your website or app. It's lightweight (about 8 KB) and captures page views and clicks automatically once it's running.

The fastest path is to copy the ready-made snippet UMAP360 generates for you — it already has your write key and endpoint filled in, so there's nothing to look up.

Get your snippet

You'll find a copy-ready install snippet in two places:

During setup — step 2 of the welcome wizard ("Install SDK") shows your snippet and your write key.
Any time after — go to Settings → API Keys (or Settings → SDK Setup) to get the snippet again.

Your write key is shown once

When your write key is first created, the full value is shown only once — copy it then. If you missed it, you can create a new key from Settings → API Keys at any time.

Add it to your site

The snippet comes in three flavours — pick whichever fits how your site is built:

Script tag (CDN) — paste a <script> tag into your page's <head>. Best for sites where you can edit the HTML directly, or via a tag manager.
npm package — install @umap360/sdk-web and initialise it in your app. Best for React, Vue, and other bundled apps.
Direct API — send events over plain HTTP with no tracker at all. Best for servers and backends.

A script-tag install looks like this:

<script src="https://cdn.jsdelivr.net/npm/@umap360/sdk-web@1/dist/umap360.min.js"></script>
<script>
  umap360.init({ writeKey: 'uk_live_YOUR_WRITE_KEY' /* …endpoint */ });
  umap360.page();
</script>

Use the snippet from your workspace

The example above is illustrative. Copy the real snippet from your workspace — it includes your own write key and the correct endpoint already, so you don't have to fill anything in.

Once the tracker is live on a page real visitors reach (not just your laptop), it begins sending page views right away.

Send your first custom event

Beyond automatic page views, you can record the actions that matter to your business with a single line:

umap360.track('Signed Up', { plan: 'pro' });

The first part is the event name; the object is optional detail (properties) you can filter and segment on later.

For developers: the full reference

This page is the product-side quick start. For the complete integration guide — every configuration option, framework examples, identity and consent APIs, and the REST endpoint — see the developer docs:

Web SDK installation — npm and CDN setup, framework usage, and the two required options.
Web SDK reference — every method and option.
Event ingestion API — send events directly over HTTP.

Next step

Once your snippet is live, confirm everything is wired up in Verify events are flowing.

Last updated 2026-06-11