Messenger chat button

Free Facebook Messenger Chat Widget

Add a Messenger button to your website so visitors can start a conversation with your Facebook page - free, in minutes.

Create your free widget See how it works
  • Opens a Messenger chat with your page
  • No Facebook plugin to configure
  • Free, with analytics

How it works

  1. 1

    Create your widget

    Add your Messenger details, name, photo and welcome message, and pick your colours. Free account required.

  2. 2

    Paste two lines of code

    Copy the snippet into your site before the closing body tag, or use one of the step-by-step guides for 31 platforms.

  3. 3

    Check the installation

    Use Check installation to confirm the widget is live, and clear your site's cache if you don't see it.

Make it yours

What you can set for the Facebook Messenger chat widget. You can change it any time without touching the code again.

  • Display name and profile photo
  • A caption such as "Typically replies within an hour"
  • Your welcome message
  • Position: left, centre or right
  • A round icon or a "Chat now" button
  • A choice of icon images
  • Button background and text colours

Analytics

See how often the widget is shown and clicked, over time, and which websites the visits came from.

Illustration only.

Who uses a Messenger button

  • Brands with an active Facebook page

    Bring website visitors into the inbox your team already answers.

  • Events and communities

    Let people ask questions where your updates already live.

  • Restaurants and cafes

    Take reservation and menu questions through Messenger.

  • Creators

    Give fans a simple way to reach you from your site.

Works with your website

Step-by-step installation guides for 31 platforms, including notes on caching, content security policies and single-page apps.

  • Any website (HTML)
  • Google Tag Manager
  • Cloudflare Zaraz
  • WordPress
  • WooCommerce
  • Shopify
  • Blogger
  • Ghost
  • Joomla
  • Drupal
  • Wix
  • Squarespace
  • Webflow
  • Google Sites
  • Magento / Adobe Commerce
  • PrestaShop
  • OpenCart
  • React
  • Next.js
  • Angular
  • Vue
  • Nuxt
  • ASP.NET Core
  • ASP.NET Web Forms
  • PHP
  • Laravel
  • CodeIgniter
  • Django
  • Flask
  • Ruby on Rails
  • Node.js / Express

Good to know

  • The widget hands your visitor to the messaging app - the conversation continues there, not on your website.
  • Your destination is fetched by the widget with its public key, so treat it as public information, like a number printed on your website.
  • When the widget is shown or clicked, A2Z Tools records the visit (IP address, page address, referrer and time) to count views and clicks. It does not collect your visitors' names or email addresses.
  • A small "powered by a2z.tools" credit link is shown in the widget.

Other widgets

Ready in a few minutes

Create your widget for free, paste it into your site, and start getting conversations.

Create your free widget See my widgets

Related Tools

More tools in the same category

Other Tools

Popular tools from across A2Z

Quick answer

To add Facebook Messenger chat to a website, create a Facebook widget in a free A2Z Tools account, enter your Facebook page, style the popup, and paste the two-line code into your site. Visitors click the button and message your page in Messenger.

Key facts

  • Free; a free A2Z Tools account is needed to create and manage widgets
  • Opens Messenger through an m.me link to the Facebook page you enter
  • The conversation continues in Messenger, not on your website
  • An independent link-out button, not a Meta-provided plugin
  • Popup with display name, caption, welcome message, profile image and a "Start Chat" button
  • Install guides for 31 platforms including WordPress, Shopify and Wix
  • Dashboard shows impressions, clicks and referring websites

What is this tool?

A Facebook Messenger chat widget is a button on your website that opens a Messenger conversation with your Facebook page. The A2Z Tools widget first shows a small popup with your name, caption and welcome message, then opens an m.me link for your page when the visitor clicks "Start Chat".

It is a link, not an embedded Messenger window, so it does not need any Facebook script on your site. Messages arrive in your page inbox, which you can answer from Messenger or Meta Business Suite. For chat that stays on your own website, see A2Z Live Chat.

How to use it

There are two separate jobs: creating the widget in your free A2Z Tools account, and adding its code to your website. Nothing appears for visitors until the second job is done.

The code is two lines - an async script tag and a div carrying your site key. Step-by-step guides cover 31 platforms: HTML, Google Tag Manager, Cloudflare Zaraz, WordPress, WooCommerce, Shopify, Blogger, Ghost, Joomla, Drupal, Wix, Squarespace, Webflow, Google Sites, Magento (Adobe Commerce), PrestaShop, OpenCart, React, Next.js, Angular, Vue, Nuxt, ASP.NET Core, ASP.NET Web Forms, PHP, Laravel, CodeIgniter, Django, Flask, Ruby on Rails and Node.js (Express). Squarespace needs a Business plan and Webflow a paid site plan before custom code can be added, and Google Sites accepts only an embed box, not a floating button.

  1. Sign in to A2Z Tools with your email address; the account is free.
  2. Create a Facebook widget and enter your Facebook page.
  3. Set the display name, caption, welcome message, profile image, icon style, position and colours, and check the preview.
  4. Save the widget and copy its two-line code.
  5. Open the installation guide for your platform and paste the code so it loads on every page.
  6. Clear your site, plugin or CDN cache, then run the Integration Centre check or open your site in a private window.
  7. Follow impressions, clicks and referring websites in your dashboard.

Example

Settings: Facebook page of a yoga studio; display name "Lotus Yoga Studio"; caption "Typically replies within a few hours"; welcome message "Questions about classes or passes? Message us on Messenger."; button style on the left; brand purple background with white text.

What a visitor sees: a Messenger button bottom left. The popup shows the studio name and message, and "Start Chat" opens Messenger with the studio page ready to receive a message.

Common use cases

  • Businesses whose customers already follow them on Facebook
  • Class, event and booking questions for studios, gyms and venues
  • Keeping social and website enquiries in one Facebook page inbox
  • Community groups and non-profits that run their contact through a Facebook page

Benefits

  • One inbox. Website enquiries land in the same page inbox as your Facebook messages.
  • No Facebook code on your site. The widget links to m.me rather than loading a Meta script.
  • Editable without reinstalling. Change the page, text or colours in your dashboard; the installed code stays the same.
  • Free and measurable. Impressions, clicks and referring websites are tracked for you.

Limitations

  • The chat does not happen on your website. The button hands the visitor to Messenger; the conversation, its history and your notifications all live there.
  • Visitors need Messenger. A visitor who does not use Facebook or Messenger cannot start a chat this way; offer a second app with the All-in-One widget.
  • No scheduling or targeting. The installed widget does not apply delay or trigger rules, business hours, device or page targeting, size or animation options, custom button text or a consent checkbox. It shows on every page that carries the code, about one second after the page loads, and its popup button always reads "Start Chat".
  • A credit link. Every widget shows a small "powered by a2z.tools" link.
  • Blockers. Ad blockers and privacy extensions can stop the widget loading for some visitors, so your counts can be lower than real traffic.
  • Platform plans. Squarespace (Business plan) and Webflow (paid site plan) restrict custom code, and Google Sites allows only an embed box.

Privacy & your data

Here is exactly what happens to the details you enter, and what the widget records once it is on your website.

The details you enter

The destination you configure - your Facebook page - is stored on A2Z Tools so the widget can use it. The code you paste into your website does not contain it: the snippet carries only a widget key, and the widget looks up its own settings when a page loads. Because that key appears in the page source of every site the widget runs on, treat the destination as public information, exactly as you would a phone number printed on your website.

Your visitors' conversations

Conversations happen entirely inside Facebook Messenger. A2Z Tools never sees, stores or has any access to the messages your visitors send you, or to their Facebook Messenger accounts.

What the widget records

So that you can see whether the widget is working, it records when it is shown and when it is clicked. Alongside each of those we keep the website and page path it happened on, the referring site, a broad device category, the browser and operating system family, and a country where the network can tell us one. Page addresses are stored without their query string, so anything your own site puts after a question mark - order numbers, email addresses, session tokens - is discarded before it reaches us.

Visitors are counted using a one-way value derived from their network address and browser, mixed with a secret, the widget's identity and the date. It cannot be reversed into an address, it is different for the same person on two different customers' websites, and it changes every day - so it can answer "how many different people" without following anyone around. The network address itself is never stored.

What is never recorded

No names, no email addresses, no message content, no full browser identification string, and no cookies of our own on your visitors' devices.

Blockers and consent

Privacy extensions and ad blockers can stop the widget loading. When that happens the widget simply does not appear for that visitor and nothing is recorded, which also means your visitor numbers are a little lower than your real traffic rather than higher.

Frequently asked questions

What do I enter - a Facebook page or a personal profile?

Enter your Facebook page. The button opens an m.me link for that page in Messenger, so messages arrive in the page inbox, which you can answer from Messenger or Meta Business Suite.

Is this the official Facebook Messenger plugin?

No. It is an independent A2Z Tools button that opens an m.me link; it does not load any Facebook script on your site or embed Messenger in your page. Visitors continue the conversation in Messenger itself.

Is the Messenger chat widget free, and do I need an account?

Yes, it is free. You need a free A2Z Tools account (email sign-in) to create, edit and track widgets, and you can make more than one widget of each type. Your visitors do not need an A2Z Tools account.

How do I install it on WordPress, Shopify or another website?

Copy the two-line code (an async script tag and a div with your site key) and follow the installation guide for your platform. Guides cover 31 platforms, including WordPress, WooCommerce, Shopify, Wix, Squarespace, Webflow, Google Tag Manager, React and Next.js. After saving, clear any site, plugin or CDN cache and use the Integration Centre check. Squarespace needs a Business plan and Webflow a paid site plan to add custom code; Google Sites allows only an embed box, not a floating button.

Will the widget slow down my website?

The script tag is async, so your page does not wait for it before rendering. The button appears about one second after the page loads. If the widget cannot load, for example because of an ad blocker, the rest of your page is unaffected.

Does the conversation happen on my website?

No. The popup is on your website, but "Start Chat" opens Facebook Messenger, and the conversation continues there. If you want visitors to chat inside your website and a team to answer from a dashboard, look at A2Z Live Chat.

What does the widget record about my visitors?

When the widget is shown or clicked, A2Z Tools records the visitor IP address, the page address and referrer, the page title, a random device id kept in your website browser storage, and the time. That is what powers the impressions, clicks and referring websites in your dashboard. Names and email addresses are not collected, and messages sent in Facebook Messenger do not pass through A2Z Tools. Your Facebook page is stored by A2Z Tools and loaded with the public site key, so treat it as public.

Can I change the widget later without reinstalling the code?

Yes. The code on your site carries only the site key, and the widget loads its current settings each time a page opens. Edit the Facebook page, text, image or colours in your dashboard and the installed widget uses the new settings; clear your site cache if you do not see the change.

Which website platforms does the widget work with?

Any website you can add HTML to. We provide step-by-step instructions for over thirty platforms, including WordPress, WooCommerce, Shopify, Wix, Squarespace, Webflow, Blogger, Ghost, Joomla, Drupal, Magento, PrestaShop, OpenCart, React, Next.js, Angular, Vue, Nuxt, ASP.NET, PHP, Laravel, CodeIgniter, Django, Flask, Ruby on Rails, Node.js, Google Tag Manager and Cloudflare Zaraz. If yours is not listed, the universal HTML instructions work anywhere.

Do I need to add anything to my website, or is creating the widget enough?

You do need to add it. Creating the widget and installing it are two separate steps, and this is the one people most often miss. After you have made the widget you copy two lines of code and paste them into your website. We show you exactly where for your platform, and there is an installation check that tells you whether it arrived.

I added the code but the widget is not showing. What should I check?

In order of likelihood: the change was not published; a cache or CDN in front of your site is still serving the old page; the code went onto one template rather than the site-wide header or footer; or your site sends a Content-Security-Policy header that does not allow a2z.tools. Opening your site in a private browsing window rules out your own browser cache. If a colleague cannot see it but you can, an ad blocker is the usual answer.

Will the widget slow my website down?

No. The script loads asynchronously and independently, so your page renders without waiting for it. If our service were unavailable the widget would simply not appear, and nothing else on your page would be affected.

Can I use the same widget on more than one website?

Technically yes - the same code works anywhere you paste it. It is usually better to create one widget per website, because then the numbers for each site are separate and the installation check knows which address to look at.

Can I see whether anybody is actually using it?

Yes. The widget reports how often it is shown and how often it is clicked, broken down by day, page, device and country. If it is being shown but never clicked, that is worth knowing too - a different position or a clearer message often helps.

Related tools

Last reviewed: