message.comDevelopers
Developers/Tutorials/Install on plain HTML

Install live chat on plain HTML

The simplest install. Paste one snippet on every HTML page where you want the chat launcher. No build step, no framework, no plugin. Two minutes total.

1. Copy your snippet

Sign in to app.message.com. Open Settings → Chats → Installation. Click Copy snippet.

2. Paste before the closing body tag

Open each HTML page where you want the widget. Paste the snippet right before </body>. Save.

example.html
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8" />
  <title>Acme</title>
</head>
<body>
  <h1>Welcome to Acme</h1>
  <!-- ... your content ... -->

  <!-- message.com live chat -->
  <script>
    (function(d,s,o){
      var j=d.createElement(s);j.async=1;j.src='https://app.message.com/widget.js';
      j.dataset.workspace=o;
      d.head.appendChild(j);
    })(document,'script','YOUR_WORKSPACE_ID');
  </script>
</body>
</html>

If you have a server-side include or a shared template footer, paste the snippet there once. The widget will load on every page that includes the footer.

3. Deploy

Upload via FTP, SFTP, S3, Cloudflare Pages, Netlify, Vercel, GitHub Pages, whatever your host requires. The widget loads from app.message.com and does not need any backend on your end.

4. Verify the install

  1. Open the page in a private window.
  2. The launcher appears in the bottom-right within two seconds.
  3. Open the browser console. Confirm the [message] startup log.
  4. Send a test message. The conversation lands in app.message.com.

Multiple pages

Three options to apply the snippet across a site:

  • Shared footer include. Most static-site generators (Jekyll, Hugo, Eleventy, Astro) have a footer partial. Paste once.
  • Build-step injection. A small post-build script can append the snippet to every .html file. find dist -name '*.html' -exec sed -i ... is fine.
  • Server-side include. Nginx and Apache both support SSI directives that inline a shared footer.

Common pitfalls

  • Snippet in <head>. Works but slows the page. Always prefer right before </body>.
  • Multiple snippets. If you paste it twice, the second copy is ignored. Audit shared partials.
  • Strict CSP. Allowlist app.message.com on script-src and connect-src. See the MDN CSP reference.
  • HTTPS only. The widget refuses to load over plain HTTP. If you are testing locally, use localhost (treated as secure) or a self-signed cert.

Next steps