Nachdem Sie Standardblöcke hinzugefügt und konfiguriert haben, können Sie zusätzlich deren mobile Version bearbeiten. Klicken Sie dazu auf das Symbol für mobile Geräte in der Mitte des Seiteneditor-Fensters.

Wählen Sie im Dropdown-Menü die gewünschte Bildschirmgröße aus. Wenn Sie überprüfen möchten, wie die Seite auf einem bestimmten Gerät angezeigt wird, wählen Sie dieses Gerät oder die am besten passende Option im Abschnitt „Geräte“ aus.

Der Editor wechselt in den Mobilmodus, wodurch sich Blöcke leichter bearbeiten lassen.

Klicken Sie im Vorschaumodus auf das Symbol für das Mobilgerät und wählen Sie die gewünschte Bildschirmgröße aus.

Um die Editor-Oberfläche auszublenden, klicken Sie auf das Pfeilsymbol in der unteren linken Ecke oder neben „Zurück zur Bearbeitung“.

Um den Maßstab der Vorschau zu ändern, klicken Sie auf das Symbol „100 %“ und wählen Sie den gewünschten Wert aus dem Dropdown-Menü aus.

Klicken Sie auf das Stiftsymbol, um zum Editor zurückzukehren und Änderungen an den Blöcken vorzunehmen.

Jeder Block verfügt über eigene Einstellungen für Abstände und Typografie für die mobile Version. Je nach Block stehen möglicherweise auch zusätzliche Einstellungen für einzelne Elemente auf Mobilgeräten zur Verfügung. Diese Einstellungen sind in der Regel im Einstellungsbereich durch Hinweise gekennzeichnet.

Ein Menüblock verfügt beispielsweise möglicherweise über eine eigene Registerkarte für diese Einstellungen.

In den Titelblöcken können die Einstellungen für die mobile Version mit einem Telefonsymbol gekennzeichnet sein.

Anpassen der Schriftgröße und des Zeilenabstands für mobile Geräte. Öffnen Sie in den Blockeinstellungen den Abschnitt „Typografie“, klicken Sie auf das Desktop-Symbol und geben Sie die Schriftgröße für die mobile Version in das Feld mit dem Symbol für mobile Geräte ein.

Der Zeilenabstand wird auf die gleiche Weise konfiguriert.

Anpassen des Eckenradius und des Abstands für Cover auf Mobilgeräten. In Blöcken der Kategorien „Cover“ und „ Bild “ können Sie für Mobilgeräte einen separaten Eckenradius oder Abstand festlegen.

Um den Radius oder den Abstand zu ändern, klicken Sie auf „Einstellungen“ und suchen Sie das entsprechende Feld. Klicken Sie anschließend auf das Desktop-Symbol neben dem Feld und geben Sie den Wert für die Mobilversion ein.

Position des Hintergrundbildes ändern. In Titelblöcken und anderen Blöcken, in denen diese Einstellung verfügbar ist, können Sie den Teil des Bildes auswählen, der im Block angezeigt werden soll.

Um die automatische Position festzulegen, wählen Sie den passenden Wert aus dem Dropdown-Menü aus, zum Beispiel „Zentriert“.

Um die Position manuell festzulegen, klicken Sie auf das Symbol neben dem Feld.

Das Bild mit den Positionierungspunkten wird geöffnet. Sie können einen der vorgefertigten Punkte auswählen oder einen eigenen Punkt an der gewünschten Stelle setzen.

Mithilfe der Positionierung lässt sich die Darstellung des Hintergrundbildes für die mobile Version so anpassen, dass dasselbe Bild auf verschiedenen Bildschirmen gut aussieht.

Öffnen Sie in einem beliebigen Block die Einstellungen, klicken Sie auf das Symbol neben den Feldern „Abstand oben“ oder „Abstand unten“ und geben Sie den Wert für das Mobilgerät ein.

Wenn Sie möchten, dass bestimmte Blöcke auf Smartphones und Desktop-Computern unterschiedlich angezeigt werden, richten Sie den Sichtbarkeitsbereich ein.

Öffnen Sie die Blockeinstellungen und scrollen Sie nach unten zur Option „Block-Sichtbarkeit auf Geräten“. Legen Sie fest, auf welchen Geräten der Block angezeigt werden soll. Speichern Sie anschließend die Einstellungen und veröffentlichen Sie die Seite erneut.

Sie können die Responsivität eines Blocks für verschiedene Geräte konfigurieren, indem Sie den Block mithilfe der entsprechenden Option in den Blockeinstellungen auf „ Zero Block “ umstellen. Diese Option ist derzeit in den meisten Blöcken verfügbar.

Nach der Konvertierung können Sie das Erscheinungsbild des Blocks manuell für fünf Bildschirmbreitenbereiche konfigurieren oder eigene Bereiche hinzufügen. Weitere Informationen zur Einrichtung des responsiven Designs in „ Zero Block “ finden Sie in den Artikeln „Zero Block: So erstellen Sie einen benutzerdefinierten Block“ und „Zero Block: Responsives Design “.

Wenn Sie die responsive Darstellung deaktivieren, sieht die Seite auf Mobilgeräten genauso aus wie auf dem Desktop.

Um die responsive Version zu deaktivieren, gehen Sie zu „Seiteneinstellungen“ → „Zusätzliche Einstellungen“, aktivieren Sie das Kontrollkästchen „Mobile Ansicht deaktivieren“ und veröffentlichen Sie die Seite erneut.