Skip to content

Documentation

Build with Engage

Connect customer data, business events, and communication channels to build automated journeys with workflows and AI.

Chat button

A floating "Chat with us" button that opens WhatsApp to your business number with a first message filled in. The conversation arrives in your Engage inbox like any other.

Get the code

In the dashboard: Settings, Website, Chat button. Enter your WhatsApp business number with the country code, the first message and the button text, and copy the HTML. It looks like this:

HTML

<a href="https://wa.me/2348030000001?text=Hi!%20I%20have%20a%20question." target="_blank" rel="noopener" class="engage-chat" aria-label="Chat with us on WhatsApp">
  <svg viewBox="0 0 24 24" width="22" height="22" aria-hidden="true"><path fill="currentColor" d="M12 2a10 10 0 0 0-8.6 15.1L2 22l5-1.3A10 10 0 1 0 12 2Zm0 18.2a8.2 8.2 0 0 1-4.2-1.2l-.3-.2-3 .8.8-2.9-.2-.3A8.2 8.2 0 1 1 12 20.2Zm4.5-6.1c-.2-.1-1.5-.7-1.7-.8s-.4-.1-.6.1-.7.8-.8 1-.3.2-.5.1a6.7 6.7 0 0 1-3.3-2.9c-.3-.4.2-.4.6-1.3a.4.4 0 0 0 0-.4l-.8-1.8c-.2-.5-.4-.4-.6-.4h-.5a1 1 0 0 0-.7.3 3 3 0 0 0-.9 2.2 5.2 5.2 0 0 0 1.1 2.8 11.9 11.9 0 0 0 4.6 4c1.7.7 2.4.8 3.2.6a2.8 2.8 0 0 0 1.8-1.3 2.3 2.3 0 0 0 .2-1.3c-.1-.1-.3-.2-.6-.3Z"/></svg>
  <span>Chat with us</span>
</a>
<style>
  .engage-chat{position:fixed;right:20px;bottom:20px;z-index:99999;display:inline-flex;align-items:center;gap:8px;padding:12px 18px;border-radius:999px;background:#0f7a40;color:#fff;font:600 15px/1 system-ui,-apple-system,"Segoe UI",sans-serif;text-decoration:none;box-shadow:0 10px 25px rgba(0,0,0,.2)}
  .engage-chat:hover{background:#0c6e39}
  .engage-chat:focus-visible{outline:3px solid #0b5e31;outline-offset:3px}
  @media (max-width:480px){.engage-chat span{display:none}.engage-chat{padding:14px}}
</style>

Paste it just before </body> on every page. On Shopify: Online Store, Themes, Edit code, theme.liquid. On WordPress, a plugin that adds code to the footer. On WooCommerce, the Engage plugin has the button built in, with the product name in the message.

What it is

A link to wa.me with a little CSS - no script, nothing loaded from elsewhere, nothing tracked. On phones it shrinks to the WhatsApp icon. White on its green measures 5.41:1, past the 4.5:1 WCAG asks for text this size.

Why a customer who taps it can be answered freely

When a customer writes first, WhatsApp opens a 24-hour window in which you can reply with anything - no template, no opt-in needed. Answer from the inbox while it is open.

Next

Conversations →

Replying from the inbox.