Mobirise Tutorials

Tutorial - VN TRanslate

Das Werkzeug „VN Translate“ wurde von Volker Niederastroth zur Live-Übersetzung von Webseiten im Browser entwickelt.

Meine hier gezeigte Version ist vom 05. September 2026.

Diese Anwendung findet ihr zum kostenlosen Download in der VN Block Galerie 

Such dort nach "VN Übersetzer" in der Kategorie "VN Tools".

Nach dem Import der Anwendung findet ihr die Anwendung im "VN Menü", das es seit dem 20. August 2026 zur vereinfachten Darstellung von den Anwendungen von Volker Niederastroth gibt.

Nach dem Import erscheint das Werkzeug „VN Translate“ im Site‑Menü von Mobirise unter „VN‑Blöcke“ als Schalter. Tragt dort zum Beispiel den API‑Key für den kostenlosen DeepL‑Dienst (bis zu 1 Million Zeichen) oder für einen anderen Dienst ein; damit wird die KI‑gestützte Übersetzung der Website aktiviert. Setzt bei DeepL ein Häkchen unter dem „Schlüssel“, falls ihr eine kostenpflichtige Lizenz erworben haben solltet.

Gebt außerdem die gewünschten Sprachen als durch Kommas getrennte Kürzel ein. Wählt außerdem den Standort für den Button, der erst online sichtbar ist. Auf der Webseite könnt ihr oder eure Besucher den Button an eine beliebige Position verschieben; er bleibt dort, da die Position im Local Storage des Browsers gespeichert wird. Auf dem Smartphone kann das Verschieben etwas fummelig sein, da ihr die Griffleiste des Buttons — also die kleinen Punkte auf seiner linken Seite — möglichst genau treffen müsst.

In der aktuellen Version vom „VN Übersetzer“ lassen sich zusätzlich API‑Keys von Microsoft Azure und Google Cloud hinterlegen. Natürlich müsst ihr euch bei den jeweiligen Anbietern zunächst registrieren und anmelden. Das gilt auch für die Links in meiner untenstehenden Tabelle. Ich habe Microsoft Azure gewählt und kann damit bis zu zwei Millionen Zeichen pro Monat kostenlos übersetzen lassen. Den Verbrauch könnt ihr live im Menü unter Metriken aufrufen.

Das Werkzeug „VN Übersetzer“ legt jede zu übersetzende Seite in einer JSON-Datei ab und prüft zunächst, ob bereits eine Übersetzung vorhanden ist. Dadurch werden API-Ressourcen eingespart und eine hohe Geschwindigkeit erreicht.

Lest dazu auch die beim Import gezeigte Splash.html 

Zum besseren Verständnis wie man den API-Key von Microsoft erstellt, wird noch ein Video erstellt.