Add MyLiveChat to your Webflow site
Webflow lets you add MyLiveChat through its Custom Code footer field — paste the MyLiveChat code once, publish, and the chat button appears site-wide. MyLiveChat helps you catch visitors while they are still on the page and keeps every conversation available afterwards.
Use this guide to add MyLiveChat to Webflow. The free plan includes one agent,
unlimited chats, and unlimited websites — no credit card required.
If you do not have a MyLiveChat account yet,
create a free MyLiveChat account.
Start free
Step 1. Get your MyLiveChat code
Sign in to the MyLiveChat web console and click
Deployment menu on the left. Choose Embedded Chat tab and copy the MyLiveChat code.
Step 2. Add the code to your Webflow project
- Open your project and go to Project Settings → Custom Code.
- Paste the MyLiveChat code from Step 1 into the Footer Code field.
- Click Save Changes, then Publish your site.
- Open the published site — the chat button appears on every page.
Check that live chat is working
Do not assume the install worked because you saw no error. Open your site in a private
browsing window and walk through this once:
- Look for the chat launcher on the page. If it is missing, view the page source and search
for mylivechat to confirm the code is really being served.
- Start a chat as a visitor and send a test message.
- Sign in to the web console and confirm the message arrives and
that you can reply.
- Close the chat and check the transcript is saved, so you know follow-up will work.
Publish first, then test the published domain. Custom code never runs in the Designer preview, so checking there will always suggest the install failed.
Common Webflow setup mistakes
- The site was not republished. Custom code in Project Settings only reaches visitors after you publish. This is the most common Webflow mistake by a wide margin.
- Only the webflow.io staging domain was checked. If you publish to both staging and a custom domain, confirm the domain your visitors actually use.
- The plan does not include custom code. Project Settings custom code requires a paid Site plan. On the free plan you can add the chat code to a page using an Embed element.
- The code was pasted into the head field. Use the Footer Code field so the widget loads after your page content.
What happens next?
After setup, sign in to the web console to answer visitors from your browser. You can also use the desktop app from the download page if your team prefers it.
Want the AI to answer first? Point the AI assistant at your site content and it handles routine questions 24/7, then hands off to a human with the full transcript when one is needed.
Why add live chat to Webflow?
Webflow sites are frequently marketing sites where every visit is paid for. Chat gives those visitors a way to ask before they bounce, and proactive invitations can trigger on your pricing or demo pages where intent is highest.
Because the code lives in Project Settings rather than in a component, it survives redesigns and republishing, and it loads on every page you publish.
Webflow live chat FAQ
Do I need a paid Webflow plan?
Custom Code in Project Settings requires a paid Site plan. On the free plan you can add the chat button to a page using an Embed element.
Do I have to republish after adding the code?
Yes. Custom code only goes live once you publish the site.
Does it work with Webflow CMS pages?
Yes. Footer code applies to all pages, including CMS collection pages.
Is it really free?
Yes. One agent, unlimited chats, and unlimited websites are free forever, with no credit card required.
Make the chat window fit your site
Colours, position, language, the pre-chat form and your offline message are all set in your
MyLiveChat dashboard rather than in your Webflow code, so you can change them without editing
your site again. See customization options for
what can be changed, and visitor monitoring if you
want to see which page a visitor is on before you reply.
Related guides
New to live chat? Start with
how to add live chat to your
website and the
live chat launch checklist, then
live chat best practices once you are
answering real conversations.
Also useful: Live chat for paid ad landing pages and
Live chat for B2B demos.
If you are worried about page speed, see
does live chat slow down your
website.
Any questions?
If anything is unclear, contact our support team from the chat button on this page or visit the Support page. We can help you choose the right setup path.