Docs

Everything fits on one page.

If the docs need a table of contents three levels deep, the product is too big.

1. Install

Paste this before </head> on every page of your app. It's the only script you need for all three modules.

<script>
  (function (w, d) {
    w.strykethru = w.strykethru || function () {
      (w.strykethru.q = w.strykethru.q || []).push(arguments);
    };
    var s = d.createElement("script");
    s.async = 1;
    s.src = "https://cdn.strykethru.com/v1/st.js";
    d.head.appendChild(s);
  })(window, document);

  strykethru("init", { key: "st_live_8f2c41a9" });
</script>

2. Identify

Call identify once you know who the user is. Every property you pass — including company details under account — becomes usable in segments. Build segments point-and-click on the Segments page (owners and editors), combine conditions with AND/OR, or start from suggestions like New users, Inactive users, Power users and Trial accounts. Conditions: user or account property, first/last seen, visits, did an event, latest survey score, stuck on a guide.

strykethru("identify", {
  userId: user.id,          // your own stable id for this person
  email: user.email,
  name: user.name,
  traits: {
    plan: user.plan,
    createdAt: user.createdAt,
    role: user.role,
    account: {               // company-level traits for account segments
      plan: account.plan,
      createdAt: account.createdAt
    }
  }
});

3. Targeting

Easiest: open a guide and click “Open live builder”. Your app opens in a new tab with an editing panel — click any element to attach a step, edit text, reorder, preview in place, and save to the draft. No extension needed; the snippet must be on the page, and only owners and editors can open it. Under the hood guides attach to a CSS selector (shown below) and branch on URL, user property, or a completed step. If the element is missing, the step is skipped rather than misplaced.

// Targeting rules are evaluated in order.
{
  selector: "#new-project",         // CSS selector on the host page
  fallback: "skip",                 // or "center" to show anyway
  when: [
    { type: "url",      op: "contains", value: "/home" },
    { type: "property", key: "plan",    op: "equals", value: "trial" },
    { type: "step",     op: "completed", value: "st_2" }
  ]
}

4. Styling

By default guides read your app's computed fonts, colors, and radii so they don't look bolted on. Override any of it explicitly.

strykethru("theme", {
  inherit: false,              // default is true
  fontFamily: "Söhne, sans-serif",
  radius: "2px",
  accent: "#E24B4A"
});

5. Environments (Growth & Scale)

Add a test environment in Settings → Environments and put its st_test_ key on your staging site. Staging always shows the latest draft of every guide and survey; your live site only shows what you've published — one guide, no copying between environments. Test visitors are free: they never count toward MAU and are hidden from Analytics, People and Feedback unless you switch on “Show test traffic”. Growth includes Production + one test environment; Scale is unlimited.

strykethru("init", { key: "st_test_…" }); // staging only

6. API (Scale plan)

Read-only access to your data. Create a key in Settings → API access, then send it as a bearer token. Endpoints: /people, /responses, /events, /stats — add ?limit= to page (max 500).

curl https://strykethru.com/api/public/v1/stats \
  -H "Authorization: Bearer st_your_key_here"

# {"people":42,"identified":18,"events":1330,"responses":27,"liveGuides":2}
# Also: /api/public/v1/people, /responses, /events?limit=500

Resource Center (all plans)

Settings → Resource Center adds an always-available help button to your app. Choose tours people can replay, show checklists with each person's saved progress, and add up to 10 help links. Segment targeting still applies: people only see tours they're eligible for. Opening it fires a resource_center_open event you can use in segments and goals.

// No extra code — the snippet you already installed renders it.

7. Webhooks & Segment

Growth and Scale: add up to 5 HTTPS endpoints in Settings → Webhooks (works with Zapier, Make, or your own server). Events: guide.completed, survey.response, checklist.item_completed. Every attempt appears in delivery history. Temporary failures are retried twice automatically; owners and editors can replay any failed delivery manually. Verify each request by computing HMAC-SHA256 of `${t}.${rawBody}` with your signing secret and comparing it to v1 in the X-StrykeThru-Signature header. Scale: paste a Segment write key to forward the same events as track calls.

POST https://your-endpoint.example.com
X-StrykeThru-Event: guide.completed
X-StrykeThru-Signature: t=1790000000,v1=<hex hmac>

{
  "id": "…",
  "event": "guide.completed",
  "created_at": "2026-09-26T12:00:00.000Z",
  "person": { "user_id": "u_123", "email": "ada@example.com" },
  "data": { "guide_id": "…", "guide_name": "Welcome tour", "url": "https://app.example.com" }
}