Tenreply logoTenreply
← Back to Blog
Guide

How to Add a WhatsApp Chat Widget to Your Website — Capture Leads Without a Form

A website chat widget turns passive visitors into active conversations — without forms, without email, and with a 98% open rate on the replies. Here is how to install and configure Tenreply's widget in minutes.

Why Most Website Contact Forms Fail

Contact forms ask visitors to stop what they are doing, fill in multiple fields, and wait hours for a reply. Most visitors do not bother. A chat widget meets them where they are — on your site, right now — and starts a conversation immediately. The difference in conversion rates between a chat widget and a contact form can be dramatic, especially for high-consideration products where customers have questions before they are ready to buy.

Tenreply's website chat widget routes conversations into your shared inbox alongside WhatsApp, Instagram DM, and Messenger — so your team handles website visitors with the same workflow as every other channel.

How the Widget Works

When a visitor clicks the widget on your site, they see a pre-filled message they can customise and send. On desktop, this opens a WhatsApp web window; on mobile, it deep-links directly to WhatsApp. The message arrives in your Tenreply inbox tagged with the page URL and any UTM attribution data from the visitor's session — so you know exactly which page drove the conversation and what campaign brought the visitor to your site.

Returning contacts who have already messaged you are matched automatically to their existing record. New contacts are created instantly with the source data intact.

Installing the Widget

In your Tenreply workspace:

  1. Go to Settings → Widget
  2. Customise the button colour, greeting message, and pre-filled text (e.g. "Hi, I have a question about...")
  3. Copy the one-line script tag generated by Tenreply
  4. Paste it before the </body> tag on any page where you want the widget to appear

The widget appears on your site immediately. No plugins, no build process, no developer needed — just one line of JavaScript.

Widget Placement Strategy

Not every page needs the same widget behaviour. A few high-impact placements:

  • Product and service pages — pre-fill the message with the product name so the conversation starts with context: "Hi, I have a question about [product]..."
  • Pricing page — visitors on the pricing page are high-intent. A "Chat to get a quote" widget converts well and captures leads before they bounce to a competitor.
  • Blog posts — readers who have just consumed a guide are primed to ask a follow-up question. A widget here captures demand you would otherwise lose.
  • Contact page — replace or supplement the contact form with a widget for faster, higher-converting lead capture.

Combining the Widget with Automation

The Tenreply widget integrates with the flow builder — so conversations that start from the website can be handled automatically outside business hours, with the bot qualifying the lead (name, what they need, budget range) before handing off to a human agent when the team is next online. This means no lead is lost just because it arrived at 11 PM.

Attribution: Know What Drove Each Conversation

Every widget conversation captures the source page URL, referring URL, and any UTM parameters from the visitor's session. In Tenreply, each contact record shows where the conversation originated — which campaign, which page, which blog post. This attribution data feeds directly into your understanding of which content and channels drive the most valuable conversations.

The Omnichannel Picture

The website widget is the fourth channel in Tenreply's omnichannel stack, alongside Instagram DM, Facebook Messenger, and WhatsApp. When all four are in one inbox, your team has a complete view of every customer interaction regardless of where it started — and customers get a fast, consistent response on whatever channel they chose.