01-minimal.html

<!--
  The simplest install: one script tag, and every labelled field on the page
  gets a help icon. Click an icon and the agent explains that question, then the
  visitor can ask follow-up questions.

  Replace YOUR_AGENT_ID (near the bottom) with your agent's id.
-->
<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width,initial-scale=1">
  <title>Form guide: simplest install</title>
</head>
<body>
  <h1>Simplest install</h1>
  <p>An ordinary HTML form with the form guide snippet. Click a help icon next to a label and the agent explains that field, then you can ask follow-up questions.</p>

  <form id="life-cover" aria-label="Life cover enquiry">
    <p>
      <label for="full-name">Full legal name</label><br>
      <input id="full-name" name="full_name" autocomplete="name">
    </p>
    <p>
      <label for="cover-amount">How much cover do you need?</label><br>
      <input id="cover-amount" name="cover_amount" type="number" min="10000" step="1000" placeholder="250000">
    </p>
    <p>
      <label for="term">For how many years?</label><br>
      <input id="term" name="term_years" type="number" min="5" max="40">
    </p>
    <p>
      <label for="smoker">Have you used nicotine in the last 12 months?</label><br>
      <select id="smoker" name="smoker">
        <option value="">Choose one</option>
        <option value="no">No</option>
        <option value="yes">Yes, including vaping or patches</option>
      </select>
    </p>
    <p>
      <label for="occupation">What is your job?</label><br>
      <input id="occupation" name="occupation">
    </p>
    <button type="submit">Get my quote</button>
  </form>

  <!--
    YOUR_AGENT_ID: your agent's id. In the Subcontext dashboard open Agents,
    your agent, Channels, Form guide. It's in the snippet shown there.
    Keep id="formguide-embed-script" as it is. It tells the script to start
    by itself.
  -->
  <script
    id="formguide-embed-script"
    src="https://js.subcontext.com/formguide-latest.js"
    data-agent-id="YOUR_AGENT_ID"></script>
</body>
</html>