Skip to content

Erste Seite anlegen ​

Du legst eine neue Seite an, fuegst eine Row mit zwei Widgets hinzu und veroeffentlichst sie. Am Ende ist die Seite unter /deine-erste-seite erreichbar und fuer Besucher sichtbar.

Was du brauchst ​

  • Ein Backend-Zugang mit Editor- oder Admin-Rechten.
  • 10 Minuten.

1. Seitenverwaltung oeffnen ​

Klick in der Seitenleiste auf Seitenverwaltung. Die Seitenliste oeffnet sich.

Seitenverwaltung mit einer Liste bestehender Seiten
Jede oeffentliche Seite deiner Website liegt hier.

2. Neue Seite hinzufuegen ​

Klick oben rechts auf Seite hinzufügen. Ein Modal oeffnet sich. Fuelle Titel und Identifikator aus (letzterer wird zum URL-Slug) und klick auf Speichern.

Modal fuer neue Seite mit Titel und Identifikator
Titel und Identifikator sind die beiden Pflichtfelder.

Regeln fuer den URL-Slug

Der Slug darf nur Kleinbuchstaben, Ziffern und Bindestriche enthalten. Umlaute, Leerzeichen und Sonderzeichen brechen URLs. Wenn du im Titel Über uns schreibst, setze den Slug manuell auf ueber-uns.

3. Pagebuilder oeffnen ​

Die neue Seite erscheint oben in der Liste. Klicke in ihrer Zeile auf Seite bauen. Der Pagebuilder oeffnet sich mit einer leeren Seite.

Leerer Pagebuilder mit Empty-State-Prompt
Eine leere Seite zeigt einen Prompt zum Einfuegen der ersten Row.

4. Erste Row hinzufuegen ​

Klick im Empty-State auf Section hinzufügen (oder auf das +-Icon im Struktur-Baum). Waehle ein Layout — eine einzelne Column nimmt die volle Breite, eine zweispaltige Row teilt sie 50/50.

Row-Layout-Picker mit 1, 2, 3, 4 Spalten-Optionen
Fuer dieses Tutorial waehlst du die einspaltige Row.

Fuer dieses Tutorial nimmst du das einspaltige Layout.

5. Text-Widget einfuegen ​

Klick auf das + in deiner neuen Column. Der Widget-Picker oeffnet sich.

Suche das Text-Widget und klicke drauf.

Widget-Picker mit hervorgehobenem Text-Widget
Das Text-Widget findest du unter der Kategorie Text.

Das Widget erscheint in der Column und das Properties-Panel oeffnet sich rechts. Fuelle Titel und Fliesstext aus und klicke im Properties-Panel auf Speichern.

6. Bild-Widget einfuegen ​

Klick auf das + unter deinem Text-Widget. Im Widget-Picker waehlst du Bild. Klick im Properties-Panel ins Bild-Feld — der Media Manager oeffnet sich. Waehle ein vorhandenes Bild oder lade ein neues hoch und klick auf Speichern.

Bild-Widget mit geoeffnetem Media Manager
Der Media Manager oeffnet sich aus jedem Bild-Feld.

7. Seite in der Vorschau pruefen ​

Die Mitte ist eine Live-Vorschau. Klicke in der Top-Bar auf Desktop, Laptop, Tablet, Mobile, um zu sehen, wie deine Seite auf jeder Bildschirmgroesse aussieht.

Breakpoint-Umschalter mit Desktop-, Laptop-, Tablet-, Mobile-Buttons
Wechsle Breakpoints, um die Seite auf jeder Bildschirmgroesse zu pruefen.

8. Seite veroeffentlichen ​

In der Top-Bar siehst du ein DRAFT-Badge — deine Aenderungen sind noch nicht live. Klicke auf Veröffentlichen.

Veroeffentlichen-Dialog mit Jetzt- und Planen-Optionen
Waehle Jetzt veröffentlichen, um sofort live zu gehen.

Im Dialog waehlst du Jetzt veröffentlichen und klickst auf Veröffentlichen.

Das Badge verschwindet. Oeffne /<dein-identifikator> in einem neuen Browser-Tab — deine Seite ist live.

Was du gelernt hast ​

  • Wie du ueber Seitenverwaltung eine Seite erstellst.
  • Wie du den Pagebuilder fuer eine Seite oeffnest.
  • Wie du eine Row, ein Column-Layout und zwei Widgets einfuegst.
  • Wie du zwischen Breakpoints wechselst.
  • Wie du einen Entwurf veroeffentlichst.

Siehe auch ​