TL;DR

It is the on-page chat box visitors use to talk to you; in Eloqra it loads from one script tag and forwards messages to you on Telegram.

Key Points

✓

Installs from a tiny [[embed-code]] snippet that sets a global ELOQRA_CHAT_CONFIG = { projectId } and boots the widget [1][2].

✓

Renders inside a [[shadow-dom]] so host-page CSS never leaks in and the widget's styles never leak out [3].

✓

Shows a floating [[chat-launcher]] bubble that opens the panel where the [[website-visitor]] and a [[support-operator]] exchange messages.

✓

Real-time updates use [[http-polling]] every few seconds (not [[websocket]]); the widget polls for new messages and pings a typing endpoint.

✓

On the first message it captures visitor context (page URL, device, [[ip-geolocation]]) and routes the [[conversation]] to the owner via [[telegram-integration]] [4].

✓

Configurable look and behavior: greeting [[welcome-message]], optional [[pre-chat-form]], color palette, [[offline-message]], and a toggleable Powered by Eloqra.

What a live chat widget is

A live chat widget is the small, embeddable chat interface a website loads so visitors can start a Conversation in real time without navigating away ^[1]^[2]. It usually appears as a Chat Launcher bubble in a bottom corner that expands into a panel for exchanging a Chat Message back and forth. Eloqra's widget targets SaaS founders and indie hackers: a website owner pastes one Embed Code snippet that defines a global config with a projectId, and the script boots the widget on every page. Because it is just a script tag, it can even be installed by an AI Coding Agent from a short instruction, with no build step or framework dependency required.

How Eloqra renders and updates it

To stay visually isolated, the Eloqra widget mounts inside a Shadow DOM, a scoped DOM subtree whose styles do not leak out and which host-page CSS cannot reach in ^[3]. This keeps the launcher and panel looking consistent regardless of the site it lives on. Unlike chat tools that use WebSocket, Eloqra keeps the transport simple: it relies on HTTP Polling, requesting new messages roughly every four to five seconds and pinging a separate endpoint to drive the Typing Indicator both ways. This polling model is easy to run and debug, and is well suited to the low-concurrency, founder-operated support the product targets.

Visitor context and operator reply flow

When a Website Visitor sends their first Chat Message, the widget records context on the visitor record: page URL, hostname, user agent, device type, browser and OS, plus IP-based IP Geolocation (country, region, city) and any UTM Parameters. An optional Pre-Chat Form can additionally collect a name and email. The stored message is then forwarded to the project owner through Telegram Integration, where an operator replies by reply-to-message or from a Telegram Mini App inbox ^[4]. That reply flows back into the widget via a Webhook and appears in the visitor's open panel, so the entire exchange happens on the page without the visitor ever knowing Telegram is involved.

Sources & References

What is a Web Widget & Why Do You Need Them? - Freshchat ↗

How Does Live Chat Work? All Hidden Mechanisms, Revealed - HelpCrunch ↗

Using shadow DOM - Web APIs | MDN ↗

Telegram Bot API ↗

Last updated: June 25, 2026

Related Terms

Live Chat

Live chat is a real-time, text-based support channel embedded in a website or app that lets visitors message a business and get answers within the same browsing session, without phoning or emailing. It pairs a customer-facing chat window with an agent or bot interface on the other side.

Chat Launcher

A chat launcher is the small floating button — usually a speech-bubble icon pinned to a bottom corner of the page — that a visitor clicks to open a live-chat window. It is the persistent, always-visible entry point to the chat experience.

Embed Code

An embed code is a short snippet of HTML or JavaScript a website owner pastes into their pages so a third-party tool loads and runs on their site. For Eloqra it is a two-line script snippet that sets a project configuration and loads the chat script, which then injects the live-chat widget.

Shadow DOM

Shadow DOM is a browser API that attaches a hidden, self-contained DOM subtree to an element, with its own scoped styles that neither leak out to the host page nor get overwritten by it. [1] Eloqra renders its entire chat widget inside a shadow root so the host site's CSS can never break the widget, and the widget's CSS can never alter the host site.

HTTP Polling

HTTP polling is a real-time technique where the client repeatedly sends HTTP requests on a fixed interval to ask the server whether new data is available, instead of holding a persistent connection. Eloqra's chat widget uses short polling roughly every 4-5 seconds to fetch new messages and typing state.

Telegram Integration

Telegram Integration is the mechanism by which Eloqra routes every website chat into the project owner's Telegram, forwarding visitor messages to a Telegram bot and flowing operator replies back to the widget. It turns Telegram into the operator inbox, so there is no separate agent console to keep open.

Collect testimonials that build trust

Eloqra gives you a lightweight live chat widget that routes every visitor message to your Telegram — free while in early access.

Get Started Free

Live Chat Widget