Track conversion funnels

Conversion funnels let you visualize visitor journeys across multiple steps so you can pinpoint bottlenecks and improve conversion rates. See exactly where visitors drop off and understand what leads to successful conversions.

Flowsery Analytics funnel features

  • Interactive insights - Hover over any step to view detailed conversion metrics
  • Revenue attribution - See revenue generated at each funnel step
  • Top sources and countries - Understand which traffic performs best at each step
  • Filtering - Apply filters to analyze specific user segments (referrer, device, etc.) or time periods

Example 1: Landing page scroll depth funnel

Measure how visitors engage with your landing page by tracking scroll depth to key sections. Use Flowsery Analytics scroll tracking to monitor scroll depth and funnels to see where visitors drop off and optimize conversion rates.

The hero section is typically where the largest share of visitors leave. Improving your headline can make a significant difference.

Set up scroll depth tracking

In this example, we assume the landing page has 4 sections: hero, features, pricing, and cta.

Add a data-fs-scroll attribute to each section after the hero. The attribute value is the goal name you want to track. For instance, scroll_to_features, scroll_to_pricing, and scroll_to_cta.

<main>
  <section id="hero" className="min-h-screen">
    <h1>Welcome to our product</h1>
    <p>Amazing features await...</p>
  </section>

  <section id="features" className="min-h-screen" data-fs-scroll="scroll_to_features">
    <h2>Features</h2>
    <div>Feature list...</div>
  </section>

  <section id="pricing" className="min-h-screen" data-fs-scroll="scroll_to_pricing">
    <h2>Pricing</h2>
    <div>Pricing cards...</div>
  </section>

  <section id="cta" className="min-h-screen" data-fs-scroll="scroll_to_cta">
    <h2>Ready to get started?</h2>
    <button data-fs-goal="cta_clicked">Get Started</button>
  </section>
</main>

For advanced usage, refer to the scroll tracking documentation.

Create the funnel

At the bottom of your Flowsery Analytics dashboard:

  1. Click "+ Funnel" and name it "Landing page engagement"
  2. Add these steps:
    • Step 1 (Page visit): URL equals / (your landing page)
    • Step 2 (Goal): scroll_to_features completed
    • Step 3 (Goal): scroll_to_pricing completed
    • Step 4 (Goal): scroll_to_cta completed
    • Step 5 (Goal): cta_clicked completed

This funnel shows you precisely where visitors lose interest and which sections generate the most engagement.

Example 2: SaaS onboarding funnel

Track the full customer journey from landing page visit, through free trial signup, to paid conversion.

Set up the goals

Track meaningful actions your visitors take, such as creating a project, inviting a team member, or initiating a checkout. Use Flowsery Analytics custom goals to track these actions from either client-side or server-side (via the Flowsery Analytics API).

// (client-side tracking example)
// On signup completion page or component
useEffect(() => {
  if (signupCompleted) {
    window?.flowsery('signup', {
      name: 'Elon Musk',
      email: 'musk@x.com',
    });
  }
}, [signupCompleted]);

// OR (server-side tracking example)
// calling Flowsery Analytics API in your backend
const handler = async (req, res) => {
  const _fs_vid = req.cookies._fs_vid;

  try {
    const response = await fetch('https://analytics.flowsery.com/api/v1/goals', {
      method: 'POST',
      headers: {
        Authorization: `Bearer ${FLOWSERY_API_KEY}`,
        'Content-Type': 'application/json',
      },
      body: JSON.stringify({
        _fs_vid: _fs_vid,
        name: 'newsletter_signup',
        metadata: {
          name: 'Elon Musk',
          email: 'musk@x.com',
        },
      }),
    });

    res.status(200).send('Goal tracked');
  } catch (error) {
    res.status(500).send('Failed to track goal');
  }
};

If you have revenue attribution configured, Flowsery Analytics automatically tracks payment and free_trial goals.

Create the funnel

In your Flowsery Analytics dashboard:

  1. Click + Funnel and name it "SaaS onboarding flow"
  2. Add these steps:
    • Step 1 (Page visit): URL equals / (landing page)
    • Step 2 (Goal): signup completed
    • Step 3 (Goal): first_action completed
    • Step 4 (Goal): free_trial completed
    • Step 5 (Goal): payment completed

This funnel reveals:

  • Landing page effectiveness - How many visitors convert to signups
  • Onboarding success - How many signups take meaningful actions
  • Trial conversion - How many active users start trials
  • Payment conversion - Your ultimate conversion rate to paid customers

Best practices

  • Start simple with 2-3 key steps, then layer in complexity
  • Name steps clearly so your data is easy to interpret
  • Track meaningful actions with custom goals rather than just page views
  • Review regularly and tackle the largest drop-offs first
  • Combine with filters to analyze specific user segments