Mobirise Tutorials

Mobirise Block AI

Tutorials zu der künstlichen Intelligenz "Mobirise AI"

Block AI

Im Juni 2025 wurde die erste Beta-Version zur Nutzung der KI in einzelnen Modulen als "Block AI" vorgestellt. 

Jetzt ist es möglich, jeden Block nachträglich von der KI bearbeiten zu lassen oder über die Block-Seite einen eigenen Custom-Block generieren zu lassen.

Die KI kann bereits CSS und JavaScript erstellen.

AI Editor

Ansicht der Block-Werkzeuge und vom AI-Editor

Block AI Editor

Für die Block-AI wurde ein neues Werkzeug-Symbol in der Toolbox hinzugefügt.

Nach einem Klick auf dieses Symbol öffnet sich der AI-Editor, in dem ihr eure Anweisungen eingeben könnt. Dabei handelt es sich beispielsweise um CSS- oder JavaScript-Anweisungen.

Unten ist als erstes Video ein Beispiel für die Erstellung eine einfachen JavaScript zur Abdunklung nach Klick auf einen Button.

Unten ein Screenshot vom durch die KI generierten Code.

Block AI Editor

Hier ein weiterer Versuch mit folgender Anweisung - diesmal in Englisch - das geht aber ebenso auf Deutsch:

Please make the word **Mobirise** 20% larger, bold, and red.

Deutsch:

Bitte mache das Wort **Mobirise** 20% größer, fett und rot.

Siehe das Ergebnis im Screenshot unten. Es wurde eine CSS-Klasse erstellt, mit der die font-size=120% gesetzt wurde

Wort-Änderung AI

Ansicht des von der AI geänderten Textes vom Wort "Mobirise"

Ansicht Änderungen durch die KI am Desktop und am Smartphone

AI Bearbeitung Desktop
AI Bearbeitung Smartphone

Beispiel-Videos

Erstes Video zeigt die Anweisung für ein JavaScript 💫 Zweites Video zeigt eine Anweisung zur Erstellung eines Carddecks

"Block AI" generiertes JavaScript

"Custom Block AI" generiertes Carddeck

Code Editor

Ansicht im Code Editor des von der AI generierten JavaScript zum Abdunkeln

AI Custom Block

Ansicht vom Custom Block AI Editor

Custom Block AI

In der Blockansicht findet ihr jetzt oben einen leeren Button. Ein Klick darauf öffnet den Editor zur Erstellung eines eigenen benutzerdefinierten Blocks.

Hier habt ihr die Möglichkeit, ein Bild hochzuladen und entsprechende Anweisungen als Prompt für die KI einzugeben.

Schaut euch als Beispiel das zweite Video oben mit der Erstellung eines Carddecks und auch das Video unten dazu an, in dem ich einen einfachen Slider erstellt habe.

Der fertig generierte Block wird unmittelbar auf der geöffneten Seite eingefügt. Ihr könnt ihn dann an die gewünschte Stelle verschieben, an der ihr diesen Block verwenden möchtet.

Video von Slider über Benutzerblock

Hier ist ein Versuch, einen Slider über die benutzerdefinierte KI zu erstellen. Die automatische Diashow wurde eigenständig generiert und stoppt bei Mouseover. Ich habe das unten erstellte Video zur KI-Generierung des Sliders unverändert gelassen, um die Dauer der Generierung zu dokumentieren. Die Bilder wurden nicht einheitlich in der Größe generiert und zu klein mit einer Breite von 1200 px, was zu einer unzureichenden Schärfe geführt hat. Ich habe diese drei Bilder durch eigene Bilder auf meinem Server ersetzt, da ich ohne Kenntnis der Bildrechte nicht auf den Anbieter "Imgix.com" verlinken möchte, den die AI zur Erstellung von Benutzerblöcken zur Zeit nutzt.

Diesen Text zur Generierung habe ich eingegeben:

Erstelle einen Slider mit drei Bildern von den Malediven am Strand. Der Block soll eine maximale Höhe von 500 px haben, und die Bilder müssen alle die gleiche Größe besitzen. Der Hintergrund des Blocks soll Dunkelblau sein. Im unteren Bereich möchte ich als Label für jedes Bild eine Beschriftung erstellen können. Der Slider benötigt auch Navigationspfeile auf der linken und rechten Seite.

Slider generiert von Custom Block AI

Video von Erstellung des Sliders oben

Custom Block AI - die Erstellung vom Slider Block oben

Kontaktformular generiert von Custom Block AI

Dieses unten stehende Formular wurde unverändert durch die KI-Komponente "Custom Block" von Mobirise erstellt. Lediglich die Breite habe ich anschließend über "Block AI" anpassen lassen.

Mein Prompt war:

"Erstelle ein einfaches Kontaktformular mit den Feldern Name, Ort, E-Mail, Betreff und Nachricht sowie einer Checkbox zur Bestätigung der Datenschutzerklärung, zu der auch ein Link eingefügt werden soll."

Kontaktformular

Fragen an die Block AI

Es ist mir zwar einmal gelungen, mit der Version 6.1.0 BETA eine Frage über die Block AI zu stellen und daraufhin in Form eines eingefügten Textes im Block eine Antwort zu erhalten. Allerdings konnte ich dies nicht wiederholen, auch nicht mit der Version 6.1.1 BETA. Anscheinend ist es bisher noch nicht möglich, auch nicht auf Englisch, mit dieser KI zu kommunizieren.