HAIL™ Concierge · Partner Installation & User Guide

Install the HAIL™ Concierge on any webpage. It automatically fits your site’s fonts, spacing, and layout.

1️⃣ Basic Installation

Paste this code block where you want the Concierge to appear. It loads instantly and requires no additional setup.

<div id="concierge-slot"></div>
<script 
  src="https://concierge-henna.vercel.app/embed/concierge.js"
  data-auto="true"
  data-lang="en"
  defer></script>
  

• data-auto="true": Concierge opens automatically on page load.
• data-auto="false": Displays a “Slide Open HAIL AI” button instead.
• data-lang: Sets the Concierge’s base language (see Language Settings below).

2️⃣ Optional: Custom Logo

You may replace the default HAIL™ logo with your own. Add data-logo pointing to your image file (PNG or SVG recommended).

<script 
  src="https://concierge-henna.vercel.app/embed/concierge.js"
  data-auto="true"
  data-lang="en"
  data-logo="https://yourdomain.com/your-logo.png"
  defer></script>
  

If data-logo is omitted, HAIL™ uses its default logo automatically.

3️⃣ Dark Mode (Overlay Theme)

HAIL™ includes a true dark-mode overlay that cleanly inverts the Concierge panel: black background, white text, and neutral gray accents. Layout, typography, and behavior remain identical to light mode.

Enable dark mode by adding data-theme="dark" to the script tag.

4️⃣ Using HAIL™ on Popular Platforms

HAIL™ works with all major website builders and content systems. Use the standard embed tools provided by your platform.

Squarespace: Add a Code block and paste the installation snippet.
WordPress: Use a Custom HTML block or embed area.
Wix: Insert an Embed Code element and paste the snippet.
Webflow, Shopify, others: Paste into a custom HTML or embed section.

No plugins are required. The Concierge loads independently and does not alter your site’s layout.

5️⃣ Language Settings & Base Language Control

HAIL™ Concierge supports full multilingual operation. The data-lang attribute defines the Concierge’s base language.

This is not a cosmetic setting. The base language determines:

All interface text (headings, buttons, labels, placeholders)
All generated responses
System phrasing and internal prompts

When the page loads, the Concierge launches fully in the specified language. This is the correct method for creating language-specific or regional pages.

Language	Key	Usage
English (Default)	`en`	data-lang="en"
Spanish	`es`	data-lang="es"
French	`fr`	data-lang="fr"
Italian	`it`	data-lang="it"
German	`de`	data-lang="de"
Portuguese	`pt`	data-lang="pt"
Dutch	`nl`	data-lang="nl"
Japanese	`ja`	data-lang="ja"
Korean	`ko`	data-lang="ko"
Chinese (Simplified)	`zh`	data-lang="zh"
Chinese (Traditional)	`zh-tw`	data-lang="zh-tw"
Russian	`ru`	data-lang="ru"
Arabic	`ar`	data-lang="ar"
Turkish	`tr`	data-lang="tr"
Vietnamese	`vi`	data-lang="vi"
Thai	`th`	data-lang="th"
Hindi	`hi`	data-lang="hi"
Greek	`el`	data-lang="el"
Hebrew	`he`	data-lang="he"

After load, visitors may switch languages using the built-in language selector beneath the output panel. To permanently change a page’s base language, update data-lang in the embed code.

6️⃣ Related Searches & Diamonds (♦)

Below many answers, the Concierge displays a Related Searches panel. Clicking a diamond (♦) automatically drills deeper into that topic.

7️⃣ Footer & Legal Line

A fixed legal line appears at the bottom of the Concierge panel: