For Webflow
A microphone in your design,
via the Embed element.
Your Webflow design is done – now it needs one spot where visitors talk instead of typing. The Speeeak widget goes in as a single script line in the Code Embed element or in the custom code settings. You pick the colour, the widget does the rest.
Real example site with a real widget – try it. Whatever you record here only reaches us and is never published. Open at full size
Why the widget fits Webflow well
The Code Embed element exists for exactly this: third-party HTML in one spot of your layout. The widget runs in it as its own frame and brings its own look – your design stays untouched.
Want the floating button on every page? The line goes into Site settings under “Custom code” in the footer code. One place, everywhere.
The message goes straight into your Speeeak Inbox. No form backend, no automation service, no mail forwarding – just the key.
How to add it
- Create a widget and copy the key. In your Speeeak account under “Widgets”, create a widget – heading, fields, consent text, colour – and copy the ready-made script line with your key.
- Paste the line into Webflow. In one spot: open the Add panel in the Designer, drag the Code Embed element onto the page (inside rich text elements via “+” and “custom code”), paste the line, save. On every page: Site settings → Custom code tab → Footer code field, paste the line with
data-art="knopf", click “Save changes”. For a single page the same field lives in Page settings (“Before </body> tag”). - Allow your domain and publish. In Speeeak, add your domain under “Allowed websites” – including the
webflow.iostaging address if you test there. Then publish the site: custom code only takes effect after publishing.
Tip: In the Designer, Webflow shows only a placeholder for script tags. That’s normal – the widget appears in preview and on the published site. Custom code is part of Webflow’s paid Site and Workspace plans (as of October 2026).
Use this template
Texts, fields, colour and display style are prepared – adjust name and colour, copy one line of code into your website, done.
Take the template into my account Step-by-step setup
Free account: 1 widget with Speeeak link. Pro: 5 widgets, Speeeak link can be switched off.
What you do with it
- Contact without form fields: on the contact page, “Tell us briefly what it’s about” – name and e-mail optional or required, your choice.
- Testimonials for the agency site: after a project, let the client speak for one minute, with consent to publish.
- Callback request: floating pill on every page, the message lands in your Inbox with a subject, you reply by voice.
- Privacy: consent text and your site’s privacy link in the widget, delete link for the sender, servers in the EU, data processing agreement in one click.
Frequently asked questions
Do visitors need an account or an app?
No. The widget runs in the browser – allow the mic, speak, send. On the phone and on the desktop.
Can I control the width in the Designer?
Yes. Put the Code Embed element inside a Div with a class and control width, spacing and breakpoints through that Div. The widget adjusts its own height.
Does the widget count as a Webflow form?
No. It uses no Webflow forms and no form submission quota. The messages live in Speeeak, not in Webflow.
What does it cost?
The free account includes one widget for one website with Speeeak link and 30 messages per month. Pro (€19/month) has five widgets, transcription and no Speeeak link. All limits are on the pricing page.
Webflow is a trademark of its respective owner. Speeeak is not affiliated with this provider.