Help

This guide explains how to add question input fields to your website so that when a visitor types a question and clicks submit, they are taken to your AI customer service page and the question is automatically submitted to Airgentic.


What This Feature Does

  • On any page where you add the question input elements, visitors can type a question into a text field and click a button (or press Enter).
  • The browser redirects to your AI support page (e.g. /ai-support or /help).
  • The question is automatically sent to the Airgentic widget on that page, so the answer appears without the visitor having to type the question again.

You can have one question input per page or several (e.g. one per section or product). Each input uses the same "target" page; only the question text changes.


Overview of Setup

  1. Choose your AI support page
    This is the page that already has the Airgentic widget (e.g. a dedicated "Ask AI" or "Support" page). No changes are needed on this page.

  2. Tell Airgentic where that page is
    You set the target URL once, either with a meta tag or a data attribute on the Airgentic script. This is the URL visitors will be sent to when they submit a question.

  3. Add the input and button
    On any other page (product pages, FAQ, contact, etc.), you add a text input and a submit button with specific IDs. The Airgentic script will find them and handle redirect + question submission.


Step 1: Set the Target URL

You must tell Airgentic which page to redirect to when a question is submitted. You can do this in one of two ways. If you use both, the meta tag is used first.

Option A: Meta tag

Add a <meta> tag in the <head> of your page (or in your shared layout):

<meta name="airgentic-question-target-url" content="/ai-support">

Use any path that matches your AI support page (e.g. /help, /ask-ai, https://yoursite.com/support). A path like /ai-support is relative to your site's origin.

Option B: Data attribute on the Airgentic script

Add the same URL as a data attribute on the script tag:

<script id="airgentic-script"
        src="https://chat.airgentic.com/_js/airgentic-1.4.js"
        data-account-id="[ACCOUNT ID]"
        data-service-id="[SERVICE ID]"
        data-airgentic-question-target-url="/ai-support"
        defer></script>

This is useful if the Airgentic script is already on most pages and you prefer to keep configuration in one place.

Summary

Method Where to put it Use when
Meta tag <head> or shared layout You want to set it per page
Script data attribute On the id="airgentic-script" tag You want one setting for all pages

Step 2: Add the Question Input and Button

On any page where you want visitors to be able to ask a question and be redirected to your AI page, add:

  • A text input for the question
  • A button that submits the question and triggers the redirect

The Airgentic script looks for elements with specific IDs. You can use either a single pair (one input + one button) or multiple pairs.

Single question input on the page

Use these exact IDs:

  • Text input: ai-question-text
  • Submit button: ai-question-submit

Example:

<input type="text" id="ai-question-text" placeholder="Ask a question..." />
<button type="button" id="ai-question-submit">Ask AI</button>

When the visitor clicks the button or presses Enter in the input, they are redirected to your target URL and the question is submitted to Airgentic on that page.

Multiple question inputs on the same page

If you want several inputs (e.g. "Ask about products", "Ask about shipping"), use numbered IDs. The number starts at 0 and must match between the text input and its button:

  • Text inputs: ai-question-text-0, ai-question-text-1, ai-question-text-2, …
  • Buttons: ai-question-submit-0, ai-question-submit-1, ai-question-submit-2, …

Example:

<!-- First pair -->
<input type="text" id="ai-question-text-0" placeholder="Ask about products..." />
<button type="button" id="ai-question-submit-0">Ask</button>

<!-- Second pair -->
<input type="text" id="ai-question-text-1" placeholder="Ask about shipping..." />
<button type="button" id="ai-question-submit-1">Ask</button>

Each pair works the same way: redirect to the target page and submit that input's value as the question.

Mixing single and numbered

You can use both on the same site (but not on the same page in a way that would confuse users):

  • On one page: ai-question-text and ai-question-submit
  • On another page: ai-question-text-0 / ai-question-submit-0, etc.

The script will attach to whichever IDs are present on each page.


Step 3: Your AI Support Page (Target Page)

The page you set as the target (e.g. /ai-support) should already have the Airgentic widget loaded as usual. You do not need to add any extra configuration there.

When a visitor arrives with a question (from one of your question inputs):

  1. The page loads and the Airgentic widget initialises.
  2. The script reads the question from the URL (it is passed in a query parameter).
  3. The question is sent to the widget and the answer is shown.
  4. The query parameter is removed from the URL in the browser (for privacy), so the question does not stay in the address bar or history.

If someone opens your AI support page without a question (e.g. from a menu link), the widget simply loads as normal with no pre-filled question.


Quick Reference

IDs the script looks for

Purpose Text input ID Button ID
Single input ai-question-text ai-question-submit
First of several ai-question-text-0 ai-question-submit-0
Second ai-question-text-1 ai-question-submit-1
ai-question-text-N ai-question-submit-N

N is an integer starting at 0.

How to set the target URL

  • Meta tag:
    <meta name="airgentic-question-target-url" content="/your-ai-page">
  • Script attribute:
    data-airgentic-question-target-url="/your-ai-page" on the id="airgentic-script" tag.

If both are set, the meta tag value is used.


Behaviour and Notes

  • Empty questions
    If the user clicks submit (or presses Enter) with an empty or whitespace-only input, no redirect happens. You can add your own validation or messaging if you want.

  • Privacy
    The question is sent in the URL once. After the target page loads, the script removes that parameter from the address bar so the question does not remain in the URL or browser history.

  • Styling
    The input and button are plain HTML. You style them with your own CSS to match your site (e.g. size, colours, borders).

  • Accessibility
    Use a clear placeholder and, if you like, a <label> or aria-label so screen-reader users understand the purpose of the field and button.


Full Example

Page with a question input (e.g. a product or FAQ page):

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="airgentic-question-target-url" content="/ai-support">
  <title>Your Page</title>
</head>
<body>
  <h1>Product name</h1>
  <p>Have a question? Ask our AI assistant.</p>

  <input type="text" id="ai-question-text" placeholder="Ask a question..." />
  <button type="button" id="ai-question-submit">Ask AI</button>

  <script id="airgentic-script"
          src="https://chat.airgentic.com/_js/airgentic-1.4.js"
          data-account-id="[ACCOUNT ID]"
          data-service-id="[SERVICE ID]"
          defer></script>
</body>
</html>

AI support page (/ai-support):
Load the Airgentic widget as you already do. No extra markup or options are required. When users are sent here from a question input, the question is submitted automatically and the URL is cleaned.


Last updated: February 2026

You have unsaved changes