Add an AI welcome banner to a Site page
The **AI welcome** section adds an interactive banner to a public Site page. Visitors see a welcome heading, an introduction and up to four suggested questions. Submitting a question navigates to a dedicated conversation page (`/chat`) on the same domain, where streaming replies, sources, history and new-chat controls are available. ## Before you begin - At least one chat widget must be **created and published** in your workspace. - The AI welcome section is available on sales Sites only. It cannot be added to customer portal templates or duplicated. - There can be only one AI welcome section per page. ## Add the section 1. Open **Sites** in your workspace. 2. Select the site and open the page you want to edit. 3. Select **Edit sections** to open the editor drawer. 4. Select **Add section**. 5. Choose **AI welcome** from the section palette. 6. Open the section's **Content** settings. 7. Select a **published chat widget** from the dropdown. 8. Enter the welcome heading, introduction, input placeholder and suggested questions (optional). 9. Save the page and publish the site. Place the AI welcome section directly below the Site header for a full-height welcome experience. ## Configure suggested questions Under **Content → Suggested questions**, choose one of four modes: | Mode | Behaviour | |---|---| | **Automatic from content** | Hub reads published record titles from the widget's knowledge sources and picks up to four distinct topics, spread across object types. No AI call or conversation is started. Suggestions refresh on page load. | | **Widget suggestions** | Uses the suggested prompts configured in the widget itself. | | **Write my own** | Enter up to four custom questions. These are preserved when you switch between modes. | | **No suggestions** | The input is shown without pre-filled questions. | New banners default to **Automatic from content**. Existing banners retain their previous mode. If automatic suggestions cannot load — for example, because the Site domain is not in the widget's allowed domains — the input remains usable without suggestions. The editor explains how to resolve the issue. ## Set a banner background Under **Design & spacing → Banner background**, choose one of three options: | Option | Behaviour | |---|---| | **Follow theme** | Uses the page's surface colour (default). | | **Solid colour** | Set a hex colour. Welcome text automatically switches between black and white for legible contrast. | | **Image** | Upload or paste a public image URL. Set image fit, position and a dark overlay to keep white text readable. | ### Image fit and position When using a background image, two fit modes are available: | Image fit | Behaviour | |---|---| | **Fill banner — crop edges** | The image covers the full banner area; edges may be cropped (default). | | **Show whole image** | The entire image is visible within the banner bounds. | Use the **Horizontal image position (%)** and **Vertical image position (%)** numeric inputs to align the image within the banner. 0 aligns to the left/top edge, 50 centres, and 100 aligns to the right/bottom edge. Position is most visible when the image is cropped or has space around it. Set a **dark overlay** between 55% and 85% to keep white welcome text readable over images. Background settings follow the Site draft and publish workflow. ## Adjust layout and sizing Under **Design & spacing → Welcome layout**: | Setting | Options | |---|---| | **Banner height** | Full screen (default), Balanced, Compact | | **Content width** | Narrow, Comfortable (default), Wide | | **Text alignment** | Centred (default), Left aligned | | **Vertical content position** | Top, Centre (default), Bottom | | **Heading size** | Small, Standard (default), Large | | **Input corners** | Soft, Rounded (default), Pill | All presets adapt to mobile screen sizes. ## Conversation page settings The `/chat` conversation page opened when a visitor submits a question from the banner can be customised separately from the banner itself. Under **Content → Conversation settings**: | Setting | Options | Default | |---|---|---| | **Welcome text** | Custom heading shown when no messages exist | *How can we help?* | | **Description** | Introductory text below the welcome heading | *Ask a question to get started.* | | **Placeholder** | Input placeholder text | Widget default | | **Reading width** | Narrow (560 px), Comfortable (768 px, default), Wide (1040 px) | Comfortable | | **Message size** | Standard (14 px), Large (16 px) | Standard | | **Reply style** | Plain (transparent background), Shaded (subtle surface) | Plain | These settings apply to the published `/chat` page for this banner's widget. They do not affect the inline editor preview. ## How the conversation works When a visitor submits a question from the welcome banner, Hub navigates to `/chat` on the same custom domain. The opening question is passed in memory and consumed once — it does not appear in the URL or browser history, and refreshing the page does not resend it. The `/chat` page keeps Site branding and provides: - A centred conversation transcript - A bottom composer - Stop and retry controls - Conversation history (if enabled on the widget) - A new-chat button - Sources alongside replies The existing public chat backend is reused. Preview conversations on draft pages are simulated and do not start live conversations. Direct visits to `/chat` use the AI welcome widget from the Site's published pages. Arbitrary widget IDs are not accepted in the URL. ## Mobile input zoom Chat input fields on published Site pages automatically use 16 px text on narrow screens and touch devices. This prevents mobile browsers from zooming in when the visitor taps the input field. Desktop and editor sizing are not affected. ## Floating widget behaviour If your Site also has a floating chat widget configured using the same widget as the AI welcome section, the separate floating widget is suppressed on pages with the banner. The Site logo links back to the home page from the conversation view. On other pages that do not have an AI welcome section, the floating widget continues to work normally. ## Editor preview Conversations in the editor and draft preview are always simulated — no live AI calls are made. The **Conversation layout** setting (Full width or Contained) controls how the conversation appears in the inline editor preview only; published Sites open the dedicated `/chat` page regardless of this setting. ## Access controls All existing widget access rules apply: - The widget must be **published**. - Visitors must be on a domain listed in the widget's **Allowed domains** settings. - Workspace module access, usage limits and server-side public object search restrictions remain in place. - Only published, explicitly public records can be used as knowledge for the banner's agent. Configuring the widget's agent and knowledge is done in the widget editor. Changes there affect all placements of that widget. ## Publish your changes Save the page to draft, then publish the site from **Settings → Publishing & versions** or the publication dropdown. The AI welcome section is included in Site version snapshots.