So fügen Sie einen Flex-Abschnitt hinzu:
- Bewegen Sie den Mauszeiger zwischen die Zeilen, und klicken Sie auf die Schaltfläche Abschnitt hinzufügen. Abschnitte werden in der linken Seitenleiste angezeigt. Alternativ können Sie auch mit der rechten Maustaste das Kontextmenü öffnen und auf Abschnitt hinzufügen klicken.
- Klicken Sie in der Seitenleiste auf Flex-Abschnitte.
- Klicken Sie auf den Flex-Abschnitt, den Sie hinzufügen möchten, und klicken Sie dann oben auf der Seite auf Speichern.
- Der Flex-Modus wird mit dem zu bearbeitenden Abschnitt geöffnet.
Container und Flexboxen hinzufügen
Nachdem Sie einen Flex-Abschnitt zu Ihrer Website hinzugefügt haben, können Sie Ihr Raster festlegen und Container und Flexboxen hinzufügen, um Widgets innerhalb des Abschnitts zu platzieren.
Um Ihr Raster im Abschnitt festzulegen, wählen Sie im Designbereich im Abschnitt Layout neu anordnen ein voreingestelltes Layout aus. Alternativ können Sie eine Reihe von Spalten, Zeilen und die Lücke zwischen den einzelnen Spalten im Abschnitt Layout anpassen auswählen.
So fügen Sie Container oder Flexboxen zum Raster hinzu:
- Fahren Sie mit dem Cursor über das Raster und klicken Sie auf die Schaltfläche + Hinzufügen ().
- Klicken Sie im Abschnitt „Flex-Elemente“ auf Container, Vertikale Flexbox oder Horizontale Flexbox. Weitere Informationen zum Auswählen eines Containers oder einer Flexbox finden Sie unter Container und Flexboxen (1.0).
- Ziehen Sie den Container oder die Flexbox an die gewünschte Stelle im Raster. Wenn Sie den Container oder die Flexbox verschieben, erscheinen blaue Punkte, mit denen Sie den Container oder die Flexbox in Bereichen des Rasters fixieren können. Sie können im Designbereich neben „Pin“ im Abschnitt „Position“ sehen, wo das Element fixiert ist.
- Ändern Sie die Größe des Containers oder der Flexbox, indem Sie Ränder auf die gewünschte Größe ziehen.
Widgets hinzufügen und bearbeiten
Sobald Sie einen Flex-Abschnitt zu Ihrer Website hinzugefügt, Ihr Raster festgelegt und einen Container oder eine Flexbox hinzugefügt haben, können Sie Widgets zu dem Container oder der Flexbox hinzufügen.
Wenn Sie sich im klassischen Editor befinden, können Sie ein Widget aus dem linken Bedienfeld in ein Raster ziehen und es dort ablegen, wodurch Sie automatisch in den Flex-Modus gelangen.
So fügen Sie Widgets hinzu:
- Fahren Sie mit dem Cursor über den Container oder die Flexbox und klicken Sie auf die Schaltfläche +.
- Suchen Sie das gewünschte Widget und wählen Sie es aus.
- Ziehen Sie das Widget im Container an die gewünschte Stelle und ändern Sie seine Größe.
- Beim Verschieben des Widgets werden blaue Punkte angezeigt, damit Sie das Widget in Bereichen des Containers fixieren können. Sie können im Designbereich neben Pin im Abschnitt „Position“ sehen, wo das Element fixiert ist.
- Nachdem Sie ein Widget hinzugefügt haben, wird der Inhaltseditor angezeigt und Sie können das Widget konfigurieren.
- Bearbeiten Sie das Design des Widgets im Designbereich.
Elemente auswählen
Es gibt mehrere Methoden, um ein Element auszuwählen:
Fahren Sie mit der Maus über das Element und klicke. Der erste Klick wählt die übergeordnete Ebene des Elements aus, der zweite Klick die verschachtelte Ebene, der dritte Klick die nächste verschachtelte Ebene und so weiter.
Fahren Sie mit der Maus über das Element und machen Sie einen Doppelklick. Damit wählen Sie das Element aus, über das Sie den Mauszeiger halten, unabhängig davon, wie verschachtelt es ist.
Fahren Sie mit dem Mauszeiger über das Element und klicken Sie auf Command/Control + Select. Damit wählen Sie das Element aus, über das Sie den Mauszeiger halten, unabhängig davon, wie verschachtelt es ist.
Flex-Elemente und Widgets kopieren und einfügen
Sie können Flex-Elemente (Raster, Container, Flexboxen) und Widgets im Flex-Modus kopieren und einfügen. Sie können zum Beispiel ein Raster von einer Seite kopieren und in einen Flex-Abschnitt auf einer anderen Seite einfügen. Sie können auch Widgets aus dem regulären Editor kopieren und in Flex-Abschnitte einfügen. Mit der Funktion zum Kopieren und Einfügen sparen Sie Zeit, da Sie so schnell komplexe Designs erstellen und Ihre Websites schneller erstellen können.
Um Flex-Elemente oder Widgets im Flex-Modus zu kopieren und einzufügen, klicken Sie mit der rechten Maustaste auf das Element oder Widget und wählen Sie Kopieren oder Einfügen aus dem Menü aus. Bei Widgets können Sie „Kopieren“ und „Einfügen“ auch durch Auswahl des Widgets und Klicken auf Mehr () aufrufen.
Um ein Widget aus dem regulären Editor zu kopieren und in einen Flex-Abschnitt einzufügen, klicken Sie im regulären Editor auf das Widget, um das Menü für Inhalt und Design zu öffnen. Klicken Sie auf das Einstellungssymbol () und wählen Sie Kopieren aus dem Menü aus. Navigieren Sie zum gewünschten Flex-Abschnitten, klicken Sie mit der rechten Maustaste darauf und wählen Sie aus dem Menü Einfügen aus.
Neuanordnen von Elementen
Sie können Pfeile verwenden, um verschachtelte Elemente in Flexboxen, Abschnitten und Rastern zu verschieben. Auf die Pfeile können Sie über die schwebende Leiste oder per Rechtsklick zugreifen, um das Kontextmenü zu öffnen. Mit den Pfeilen können Sie die Elemente neu anordnen, um die Bearbeitung zu vereinfachen und das unerwartete Verschachteln von Elementen zu vermeiden.
Elemente können in die folgenden Richtungen verschoben werden:
In Flexboxen verschachtelte Elemente. In horizontalen Flexboxen können Elemente von links nach rechts verschoben werden. In vertikalen Flexboxen können Elemente nach oben oder unten verschoben werden.
In einem Abschnitt verschachtelte Raster. Kann nach oben oder unten verschoben werden.
In Rastern oder Containern verschachtelte Elemente. Können in jede Richtung bewegt werden, solange zwei Elemente nebeneinander liegen und sich über die gesamte Zelle erstrecken.