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