Add Speeeak
to your website.
Recording widget, embedded voice messages, WordPress, React, API – all in a few lines. One widget already in the free account, more from Pro.
New here? Tutorial: a microphone on your website – step by step from empty HTML to a working widget, with a live example site and a file to download. Guides with pictures: docs.speeeak.io
1. Recording widget – visitors leave you a voice message
Create a key in your account under Widgets, then insert this line where the widget should appear:
<script src="https://speeeak.de/js/widget.js" data-widget="YOUR-KEY" async></script>Optional data-breite="100%". The height adjusts itself. Messages land in your inbox – with name, email and subject if you switch those fields on.
Floating instead of inline
<script src="https://speeeak.de/js/widget.js" data-widget="YOUR-KEY" data-art="popup" data-text="Leave a voice message" data-position="rechts" data-farbe="#6751df" data-textfarbe="#ffffff" async></script>data-art: knopf (pill button → panel in the corner), popup (pill button → window in the centre), lasche (tab at the edge of the page), rund (round button, icon only). Once in the footer of your website – appears on every page. The same attributes apply to einbetten.js (default label “Listen to the message”).
2. Embed a voice message with landing page
Every message with a landing page has the button “Embed” in your account. The snippet:
<script src="https://speeeak.de/js/einbetten.js" data-nachricht="ID" async></script>Without script: <iframe src="https://speeeak.de/n/ID/einbetten" style="width:100%;max-width:720px;height:620px;border:0"></iframe>
3. WordPress
- Download the ZIP, upload it in WordPress under Plugins → Add New → Upload Plugin and activate it.
- Open Settings → Speeeak – there it explains step by step where to find your widget key and how to put the widget on a page (block “Speeeak Widget” or shortcode
[speeeak_widget]). - Embed a message: block “Speeeak Nachricht” with the ID from the listening link – or
[speeeak_nachricht kennung="…"].
4. React
import { SpeeeakWidget, SpeeeakNachricht } from './SpeeeakWidget';
<SpeeeakWidget schluessel="w…" breite="640px" />
<SpeeeakNachricht kennung="…" />No dependencies other than React. The component takes care of the height and only accepts messages from speeeak.io.
5. Allowed websites and privacy
- In the widget you can define which websites it may run on – then it won't be shown anywhere else.
- Before sending, visitors see who the message goes to and how long it is stored; they confirm this with a checkbox.
- Everything is stored on servers in the EU and deleted automatically once your retention period expires.
Want to fetch messages via an interface or send them to your own systems? The API is available for Business customers – contact via the legal notice.
For thoughts that sound better than they read.