Install Echo Support on your site
The tag to paste, the attributes it accepts, and what to check afterwards.
Echo Support is added to an existing site with a single <script> tag. The file it loads draws the chat button and the panel that opens on click: nothing to install, no package to add, no change to your own code.
1. Get your organization id
The dashboard shows the tag already filled in with your organization id, under Configuration → Integrations (app.echo-group.ca/support/integrations). A button there copies the whole tag, id included.
2. Paste the tag into your pages
<script
src="https://widget.echo-group.ca/widget.js"
data-organization-id="YOUR_ORGANIZATION_ID"
></script>Put it just before the closing <body> tag, on every page where the chat should appear. The loader waits for the page to be ready before drawing anything, and appends its elements at the end of the document body — so the exact position of the tag makes no difference to what is displayed.
3. Check it
Reload the page: a round 60-pixel button appears in the chosen corner. Clicking it opens a 400 × 600 pixel panel — narrowed to the window on a small screen — and its icon becomes a cross, which closes the panel again.
The attributes it accepts
| Attribute | Values | Default | Effect |
|---|---|---|---|
| data-organization-id | the id shown under Integrations | none — required | Ties conversations to your organization. Without it, the loader writes an error to the browser console and displays nothing at all. |
| data-color | a six-digit hexadecimal colour, for example #1a5af0 | #1a5af0 | Colour of the floating button, of its shadow, and of the panel. |
| data-position | bottom-right, bottom-left | bottom-right | Corner of the window where the button and panel sit. |
The widget follows your site’s dark theme: if your page puts the "dark" class on the <html> element, the panel is displayed dark — on load, and again every time that class changes.
If nothing shows up
- Open the browser console. "Echo Widget: data-organization-id attribute is required" means the attribute is missing or empty: the loader stops there, on purpose.
- Check that the tag really is in the page being served, and not commented out. The loader first reads the tag currently running; failing that, it looks in the page for a tag whose address contains "widget" and which carries the data-organization-id attribute.
- Include the tag only once per page: every copy runs the loader again, and adds a button of its own.
What your plan allows
The tag is the same on every plan. What changes is what the widget can do behind it.
| Free | Essential | Pro | Business | |
|---|---|---|---|---|
| Conversations per month | 25 | 250 | 1,000 | 3,000 |
| AI agent | not included | included | included | included |
| Users | 1 | 3 | 5 | 10 |
| Knowledge base documents | 0 | 5 | 20 | 100 |
| Plan history | 7 days | 1 month | 3 months | 1 year |
| “Powered by Echo” line | shown | shown | shown | shown |