Morse code translator for your website
Put the Morse Universe translator on your own page, free. Pick a language, a theme and a starting message, copy the code, and paste it where your site takes HTML.
How to add it
- Pick the language your visitors read: English, Indonesian, Spanish, Portuguese, Japanese, Italian, Turkish, Vietnamese, Russian or Arabic.
- Pick the light or dark theme, whichever sits better on your page.
- Type a starting text if you want the translator to open with your own message.
- Press Copy code.
- Paste the code where your site takes HTML, then publish the page.
What the code does
It has three parts. The iframe shows the translator, 830 pixels tall to start with. The link under it names Morse Universe, and keeping it is the one thing we ask in return. The short script resizes the frame to fit the translator, which is about 600 pixels on a computer and 750 to 830 on a phone, where the two panels stack.
Your visitors get the same translator as our morse code translator page: text to morse and back, sound at 10 to 25 words per minute (WPM), and Copy and Share link buttons. A shared link opens the translator on morseuniverse.com. The flashlight and vibration are left out, because browsers don’t allow them inside a frame from another site.
In Indonesian, Spanish, Portuguese, Japanese, Italian, Turkish, Vietnamese, Russian or Arabic, the buttons and labels are in that language, and the link under the frame points to our translator in it: Kode morse translator, Traductor de código morse, Tradutor de código morse, モールス信号 変換, Traduttore codice morse, Mors alfabesi çeviri, Dịch mã Morse, Переводчик азбуки Морзе or مترجم شفرة مورس.
What people type stays in their browser: the translator converts and plays it on their device and sends it nowhere. Our privacy page has the details.
Questions
How do I add the translator to WordPress?
In the block editor, add a Custom HTML block where you want the translator and paste the code. In Elementor, the HTML widget takes it the same way. WordPress.com removes iframes and scripts on some plans, so if the translator doesn’t show there, that is the reason.
How do I embed the code in Google Sites?
Choose Insert, then Embed, and open the Embed code tab. Paste the code, press Next, then Insert. Google Sites shows embedded code in a box of its own, so drag the box’s bottom edge down until the whole translator shows.
How do I add the translator to Squarespace?
Add a Code block where you want it and paste the code. Squarespace runs scripts in Code blocks only on some plans; without the script, the frame stays 830 pixels tall, which still fits the translator on a phone.
Does the frame’s height adjust by itself?
Yes, with the script in the code. An iframe can’t size itself to what’s inside it, so the translator reports its height each time it changes, and the script sets the frame to match. It only listens to messages from morseuniverse.com, and if your site removes it, the frame stays 830 pixels tall.
Why does the code allow clipboard-write?
So the Copy buttons inside the translator work. Chrome blocks copying from a frame that comes from another site unless the page around it allows it, and allow="clipboard-write" does that for this frame only. It lets the translator write to the clipboard, never read from it.
More morse tools
- Morse code translator
The full translator, with presets, the A to Z grid and the flashlight.
- Printable morse code chart
Free PDFs of A to Z, numbers and punctuation to hand out.
- Morse code worksheet generator
Decoding sheets for a class, with an answer key.