Documentation

Nudgify Docs

Install, configure, and understand your onboarding flows.

Get started in 10 minutes

One line of code. Your developer does it once — after that, you manage everything from the dashboard.

1. Install the snippet

index.html

<!-- Add before closing </body> tag in your HTML -->
<script src="https://nudgify-dashboard.vercel.app/snippet" async></script>
<script>
  Nudgify.init("proj_xxxxxxxxxxxx"); // ← copied from your Settings page
</script>

Replace proj_xxxxxxxxxxxx with your project key from the Settings page. It's pre-filled there — just copy and paste.

The snippet URL is automatically set to your Nudgify deployment. Copy the pre-filled snippet from your Settings page to get your exact URL.

Works immediately, no configuration needed. Nudgify will show a demo flow so you can confirm it's installed correctly.

Optional: identify your users for smarter targeting

optional

Call Nudgify.identify() after your user logs in to unlock plan-based and session-based targeting rules.

Nudgify.identify({
  id: "user_123",        // your user's unique ID
  plan: "free",          // "free" | "pro"
  session_count: 3,      // how many times they've logged in
  role: "admin",         // optional: "admin" | "viewer"
});

idstring

Your user's unique ID from your database.

plan"free" | "pro"

Their current subscription tier. Used in upgrade-prompt targeting.

session_countnumber

Number of sessions this user has had. Target first-timers or power users.

rolestring (optional)

Any role string — e.g. "admin" or "viewer". Available for future targeting rules.

Tip: Call identify() every session — Nudgify always uses the latest values for targeting. It's fine to call init() before the user is known; just follow it with identify() as soon as you have their data.

Show flows to the right users

Each flow has targeting rules that control who sees it. Rules are evaluated in the browser — no server round trip.

🔗

URL contains

Shows the flow only on pages whose URL matches the given string.

/dashboard→ only shows on the dashboard

/settings→ only shows on settings

app.→ only shows on your app subdomain

💳

User plan

Matches users on a specific subscription tier. Perfect for upgrade prompts.

free→ shows only to free-plan users

pro→ shows only to paying users

🔄

Session count

Matches based on how many sessions a user has had. Three comparison operators.

≤ 1→ first-time visitors only (lte 1)

≥ 5→ power users only (gte 5)

= 10→ exactly their 10th session (eq 10)

AND vs OR logic

When you add multiple conditions, choose how they combine in the Targeting tab.

AND

All conditions must match. Example: free plan AND URL contains /dashboard.

Any condition can match. Example: free plan OR session count ≤ 1.

Three ways to reach your users

Each step in a flow is one of three types. Mix and match them to create a guided experience.

🪟

Modal

Highest visibility

A centered overlay with a dimmed background. Grabs full attention — ideal for first-time welcomes, important announcements, and upgrade prompts.

—Supports an optional title + body text
—Closes when user clicks outside or hits ✕
—Multi-step flows show a step counter (e.g. 1 of 3)

💬

Tooltip

Contextual

Anchored to a specific element on the page via a CSS selector. Points users to exactly what you're describing.

—Falls back to bottom-right corner if the selector isn't found
—Selector is set in the Content tab of the flow builder

Target selector examples

#upgrade-btn          // by element ID
.nav-menu             // by CSS class
[data-id="feature"]   // by data attribute

📢

Banner

Non-intrusive

A full-width strip pinned to the top or bottom of the page. Low friction — best for feature announcements and soft nudges.

—Supports top or bottom position
—Background color and padding are customizable in the Design tab

Understanding your data

Nudgify tracks user interactions automatically. No extra code needed beyond the initial install.

Impressions

How many times a flow was shown to a user.

Completions

User clicked through all steps and hit a Complete action.

Completion rate

Completions ÷ impressions × 100. The primary health metric.

Events tracked automatically

flow_shown

The flow was displayed to the user.

step_advanced

User clicked the CTA button on a step.

flow_completed

User finished the last step (or clicked a Complete action).

flow_dismissed

User closed the flow early via the ✕ button.

Events are batched and sent every 5 seconds, or immediately on page unload. This keeps network requests minimal without losing data.

FAQ

Common questions about Nudgify.

Will it slow down my app?

No. The snippet loads asynchronously (async attribute) and is under 10 KB gzipped. It has zero dependencies and is designed to never block your app's rendering.

Does it work with React / Vue / Angular?

Yes — Nudgify is plain JavaScript with no framework dependencies. It injects lightweight DOM elements directly, so it works inside any framework or plain HTML app.

What happens if a user has an ad blocker?

Unlike tools that load from a third-party CDN, Nudgify's snippet is served from your own domain. Ad blockers target known third-party domains, so your flows are unaffected.

Can I show a flow multiple times?

By default each flow shows once per user (tracked in localStorage). To show it again — useful for testing — call:

Nudgify.reset();

This clears all shown-flow state for the current browser.

Ready to get started?

Create your account and ship your first flow today.

Start for free →