Support areas

Support tools

Launch support before users arrive.

Turn scattered docs, tickets, releases, screenshots, notes, and repeated replies into widget help, hosted docs, tickets, feedback, changelog support, and reviewed answers.

Create workspace

Demo Install Use Cases

Resources

Setup guides

Evaluate & trust

Prepare your support inputs before setup.

Use the pre-onboarding package to organize scattered docs, tickets, FAQs, screenshots, recordings, release notes, and repeated replies.

Open package

Pricing

Create workspace

Install AnswerLattice

React SPA install

React SPA guidance for installing the v1 widget once and updating context on router changes.

Install target

One v1 widget script in the app shell

Safe context

Path, title, feature, workflow, role, locale

Verification

Loaded, origin allowed, route allowed, context received

Download agent kit View Markdown

Install verification

The widget goes live only after runtime checks pass.

Script, allowed origin, blocked route, safe context, and fallback checks are visible before product users rely on support.

Install script

Add the v1 widget script and safe context adapter.

Run checks

Verify origin, route, context, and fallback readiness.

Launch widget

Go live only after the runtime checks pass.

AI agent Manual Next.js React Vue Plain HTML Shopify Webflow

Agent-ready snippet

import { useEffect } from 'react';
import { useLocation } from 'react-router-dom';

function loadAnswerlattice(widgetKey, updateContext) {
  const existing = document.querySelector('script[data-answerlattice-widget="v1"]');
  if (existing) {
    if (window.AnswerlatticeWidget) updateContext();
    else existing.addEventListener('load', updateContext, { once: true });
    return () => existing.removeEventListener('load', updateContext);
  }
  const script = document.createElement('script');
  script.src = 'https://answerlattice.com/widget/v1/answerlattice-widget.js';
  script.async = true;
  script.setAttribute('data-answerlattice-widget', 'v1');
  script.setAttribute('data-answerlattice-key', widgetKey);
  script.addEventListener('load', updateContext, { once: true });
  document.head.appendChild(script);
  return () => script.removeEventListener('load', updateContext);
}

export function AnswerlatticeInstall() {
  const location = useLocation();
  const widgetKey = import.meta.env.VITE_ANSWERLATTICE_WIDGET_KEY;

  useEffect(() => {
    if (!widgetKey) return;
    const updateContext = () => window.AnswerlatticeWidget?.page({
      path: location.pathname,
      title: document.title,
      feature: location.pathname.split('/').filter(Boolean)[0] || 'app',
      role: 'member',
      locale: navigator.language || 'en',
    });
    const removeLoadListener = loadAnswerlattice(widgetKey, updateContext);
    updateContext();
    return removeLoadListener;
  }, [location.pathname, widgetKey]);

  return null;
}