Guided Hero starter — install in 5 minutes

Legacy. The Guided Hero starter is still supported for existing installs, but it is no longer offered when you create a Rep. For new builds use a Capture Rep — drafted brief (chips plus an auto-composed message, managed in the app) or the Context API if you want to keep your own hero.

The Guided Hero starter is a packaged version of the Context API. One <div> and one <script> render a full hero block with selector chip groups, then mount the Answer Engine Rep pre-wired to your selections.

Install

<div data-nds-hero='{
  "site_id": "YOUR_SITE_ID",
  "headline": "Tell us what you need",
  "subheadline": "Pick a few options — we will draft the brief for you.",
  "groups": [
    { "key": "service",  "label": "I need",   "options": ["Website", "Landing page", "Ad campaign"] },
    { "key": "budget",   "label": "Budget",   "options": ["< $2k", "$2k–10k", "$10k+"] },
    { "key": "timeline", "label": "Timeline", "options": ["ASAP", "1–3 months", "Exploring"] }
  ]
}'></div>
<script async src="https://nextdaysales.com/widget/guided-hero.v1.js"></script>

The starter:

• Renders a responsive two-column hero (copy + Rep) you can theme via CSS variables (--nds-primary, --nds-border, --nds-radius, --nds-font).
• Tags every chip with data-nds-context and data-nds-value, so selections feed directly into the brief.
• Lazy-loads nds-context.v1.js and search.v1.js once per page.

When to use which

You want…	Use
A full hero block with zero design work	Guided Hero starter (this article)
To keep your existing hero and just feed context to the Rep	Context API

Privacy

Selections live only in Rep memory for the current page load. No cookies, no localStorage IDs, no visitor fingerprinting. Context is persisted server-side only when a lead is captured, alongside the visitor's email and message.